sceyt-chat-react-uikit 1.7.4-beta.6 → 1.7.4-beta.8
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/components/Message/Message.types.d.ts +21 -0
- package/components/Message/MessageBody/index.d.ts +22 -1
- package/components/Message/OGMetadata/index.d.ts +20 -1
- package/components/Message/index.d.ts +1 -1
- package/components/Messages/MessageList/index.d.ts +16 -0
- package/components/Messages/index.d.ts +16 -0
- package/index.js +368 -170
- package/index.modern.js +368 -170
- package/package.json +1 -1
package/index.js
CHANGED
|
@@ -10304,6 +10304,11 @@ var setPendingMessage = function setPendingMessage(channelId, pendingMessage) {
|
|
|
10304
10304
|
var getPendingMessagesMap = function getPendingMessagesMap() {
|
|
10305
10305
|
return pendingMessagesMap;
|
|
10306
10306
|
};
|
|
10307
|
+
var clearPendingMessagesMap = function clearPendingMessagesMap() {
|
|
10308
|
+
Object.keys(pendingMessagesMap).forEach(function (channelId) {
|
|
10309
|
+
delete pendingMessagesMap[channelId];
|
|
10310
|
+
});
|
|
10311
|
+
};
|
|
10307
10312
|
var draftMessagesMap = {};
|
|
10308
10313
|
var audioRecordingMap = {};
|
|
10309
10314
|
var getDraftMessageFromMap = function getDraftMessageFromMap(channelId) {
|
|
@@ -10817,7 +10822,6 @@ var _messageSlice$actions = messageSlice.actions,
|
|
|
10817
10822
|
removeSelectedMessage = _messageSlice$actions.removeSelectedMessage,
|
|
10818
10823
|
clearSelectedMessages = _messageSlice$actions.clearSelectedMessages,
|
|
10819
10824
|
setOGMetadata = _messageSlice$actions.setOGMetadata,
|
|
10820
|
-
updateOGMetadata = _messageSlice$actions.updateOGMetadata,
|
|
10821
10825
|
setMessageMarkers = _messageSlice$actions.setMessageMarkers,
|
|
10822
10826
|
setMessagesMarkersLoadingState = _messageSlice$actions.setMessagesMarkersLoadingState,
|
|
10823
10827
|
updateMessagesMarkers = _messageSlice$actions.updateMessagesMarkers;
|
|
@@ -11982,12 +11986,6 @@ function setOGMetadataAC(url, metadata) {
|
|
|
11982
11986
|
metadata: metadata
|
|
11983
11987
|
});
|
|
11984
11988
|
}
|
|
11985
|
-
function updateOGMetadataAC(url, metadata) {
|
|
11986
|
-
return updateOGMetadata({
|
|
11987
|
-
url: url,
|
|
11988
|
-
metadata: metadata
|
|
11989
|
-
});
|
|
11990
|
-
}
|
|
11991
11989
|
function setUpdateMessageAttachmentAC(url, attachmentUrl) {
|
|
11992
11990
|
return updateMessageAttachment({
|
|
11993
11991
|
url: url,
|
|
@@ -32344,7 +32342,7 @@ var MessageStatusUpdated = styled__default.span(_templateObject4$m || (_template
|
|
|
32344
32342
|
return props.color;
|
|
32345
32343
|
});
|
|
32346
32344
|
|
|
32347
|
-
var _templateObject$C, _templateObject2$x, _templateObject3$r, _templateObject4$n, _templateObject5$i, _templateObject6$g, _templateObject7$e, _templateObject8$d;
|
|
32345
|
+
var _templateObject$C, _templateObject2$x, _templateObject3$r, _templateObject4$n, _templateObject5$i, _templateObject6$g, _templateObject7$e, _templateObject8$d, _templateObject9$b, _templateObject0$a, _templateObject1$7;
|
|
32348
32346
|
var validateUrl = function validateUrl(url) {
|
|
32349
32347
|
try {
|
|
32350
32348
|
var urlObj = new URL(url);
|
|
@@ -32354,10 +32352,37 @@ var validateUrl = function validateUrl(url) {
|
|
|
32354
32352
|
}
|
|
32355
32353
|
};
|
|
32356
32354
|
var OGMetadata = function OGMetadata(_ref) {
|
|
32357
|
-
var _metadata$
|
|
32355
|
+
var _metadata$og7, _metadata$og7$image, _metadata$og7$image$, _metadata$og9, _metadata$og9$favicon, _metadata$og13, _metadata$og14, _metadata$og15;
|
|
32358
32356
|
var attachments = _ref.attachments,
|
|
32359
32357
|
state = _ref.state,
|
|
32360
32358
|
incoming = _ref.incoming,
|
|
32359
|
+
_ref$ogShowUrl = _ref.ogShowUrl,
|
|
32360
|
+
ogShowUrl = _ref$ogShowUrl === void 0 ? false : _ref$ogShowUrl,
|
|
32361
|
+
_ref$ogShowTitle = _ref.ogShowTitle,
|
|
32362
|
+
ogShowTitle = _ref$ogShowTitle === void 0 ? true : _ref$ogShowTitle,
|
|
32363
|
+
_ref$ogShowDescriptio = _ref.ogShowDescription,
|
|
32364
|
+
ogShowDescription = _ref$ogShowDescriptio === void 0 ? true : _ref$ogShowDescriptio,
|
|
32365
|
+
_ref$ogShowFavicon = _ref.ogShowFavicon,
|
|
32366
|
+
ogShowFavicon = _ref$ogShowFavicon === void 0 ? true : _ref$ogShowFavicon,
|
|
32367
|
+
_ref$order = _ref.order,
|
|
32368
|
+
order = _ref$order === void 0 ? {
|
|
32369
|
+
image: 1,
|
|
32370
|
+
title: 2,
|
|
32371
|
+
description: 3,
|
|
32372
|
+
link: 4
|
|
32373
|
+
} : _ref$order,
|
|
32374
|
+
_ref$maxWidth = _ref.maxWidth,
|
|
32375
|
+
maxWidth = _ref$maxWidth === void 0 ? 400 : _ref$maxWidth,
|
|
32376
|
+
maxHeight = _ref.maxHeight,
|
|
32377
|
+
ogContainerBorderRadius = _ref.ogContainerBorderRadius,
|
|
32378
|
+
ogContainerPadding = _ref.ogContainerPadding,
|
|
32379
|
+
ogContainerClassName = _ref.ogContainerClassName,
|
|
32380
|
+
_ref$ogContainerShowB = _ref.ogContainerShowBackground,
|
|
32381
|
+
ogContainerShowBackground = _ref$ogContainerShowB === void 0 ? true : _ref$ogContainerShowB,
|
|
32382
|
+
ogContainerBackground = _ref.ogContainerBackground,
|
|
32383
|
+
_ref$infoPadding = _ref.infoPadding,
|
|
32384
|
+
infoPadding = _ref$infoPadding === void 0 ? '0 8px' : _ref$infoPadding,
|
|
32385
|
+
ogContainerMargin = _ref.ogContainerMargin,
|
|
32361
32386
|
_ref$target = _ref.target,
|
|
32362
32387
|
target = _ref$target === void 0 ? '_blank' : _ref$target;
|
|
32363
32388
|
var dispatch = useDispatch();
|
|
@@ -32366,7 +32391,8 @@ var OGMetadata = function OGMetadata(_ref) {
|
|
|
32366
32391
|
});
|
|
32367
32392
|
var _useColor = useColors(),
|
|
32368
32393
|
incomingMessageBackgroundX = _useColor[THEME_COLORS.INCOMING_MESSAGE_BACKGROUND_X],
|
|
32369
|
-
outgoingMessageBackgroundX = _useColor[THEME_COLORS.OUTGOING_MESSAGE_BACKGROUND_X]
|
|
32394
|
+
outgoingMessageBackgroundX = _useColor[THEME_COLORS.OUTGOING_MESSAGE_BACKGROUND_X],
|
|
32395
|
+
textSecondary = _useColor[THEME_COLORS.TEXT_SECONDARY];
|
|
32370
32396
|
var attachment = React.useMemo(function () {
|
|
32371
32397
|
return attachments.find(function (attachment) {
|
|
32372
32398
|
return attachment.type === attachmentTypes.link;
|
|
@@ -32374,28 +32400,25 @@ var OGMetadata = function OGMetadata(_ref) {
|
|
|
32374
32400
|
}, [attachments]);
|
|
32375
32401
|
var metadata = React.useMemo(function () {
|
|
32376
32402
|
return oGMetadata[attachment === null || attachment === void 0 ? void 0 : attachment.url] || null;
|
|
32377
|
-
}, [oGMetadata, attachment
|
|
32403
|
+
}, [oGMetadata, attachment]);
|
|
32378
32404
|
var _useState = React.useState(false),
|
|
32379
32405
|
imageLoadError = _useState[0],
|
|
32380
32406
|
setImageLoadError = _useState[1];
|
|
32381
32407
|
var _useState2 = React.useState(false),
|
|
32382
|
-
|
|
32383
|
-
|
|
32384
|
-
var _useState3 = React.useState(false),
|
|
32385
|
-
shouldAnimate = _useState3[0],
|
|
32386
|
-
setShouldAnimate = _useState3[1];
|
|
32408
|
+
shouldAnimate = _useState2[0],
|
|
32409
|
+
setShouldAnimate = _useState2[1];
|
|
32387
32410
|
var handleMetadata = React.useCallback(function (metadata) {
|
|
32388
32411
|
if (metadata) {
|
|
32389
32412
|
dispatch(setOGMetadataAC(attachment === null || attachment === void 0 ? void 0 : attachment.url, metadata));
|
|
32390
32413
|
} else {
|
|
32391
32414
|
dispatch(setOGMetadataAC(attachment === null || attachment === void 0 ? void 0 : attachment.url, null));
|
|
32392
32415
|
}
|
|
32393
|
-
}, []);
|
|
32416
|
+
}, [dispatch, attachment]);
|
|
32394
32417
|
var ogMetadataQueryBuilder = React.useCallback(function (url) {
|
|
32395
32418
|
try {
|
|
32396
32419
|
var client = getClient();
|
|
32397
32420
|
var _temp3 = function () {
|
|
32398
|
-
if (client) {
|
|
32421
|
+
if (client && client.connectionState === CONNECTION_STATUS.CONNECTED) {
|
|
32399
32422
|
var _temp2 = _catch(function () {
|
|
32400
32423
|
var queryBuilder = new client.MessageLinkOGQueryBuilder(url);
|
|
32401
32424
|
return Promise.resolve(queryBuilder.build()).then(function (query) {
|
|
@@ -32442,7 +32465,7 @@ var OGMetadata = function OGMetadata(_ref) {
|
|
|
32442
32465
|
});
|
|
32443
32466
|
});
|
|
32444
32467
|
}, function () {
|
|
32445
|
-
console.log('Failed to fetch OG metadata');
|
|
32468
|
+
console.log('Failed to fetch OG metadata', url);
|
|
32446
32469
|
handleMetadata(null);
|
|
32447
32470
|
});
|
|
32448
32471
|
if (_temp2 && _temp2.then) return _temp2.then(function () {});
|
|
@@ -32454,7 +32477,7 @@ var OGMetadata = function OGMetadata(_ref) {
|
|
|
32454
32477
|
} catch (e) {
|
|
32455
32478
|
return Promise.reject(e);
|
|
32456
32479
|
}
|
|
32457
|
-
}, []);
|
|
32480
|
+
}, [handleMetadata]);
|
|
32458
32481
|
React.useEffect(function () {
|
|
32459
32482
|
if (attachment !== null && attachment !== void 0 && attachment.id && attachment !== null && attachment !== void 0 && attachment.url && !metadata) {
|
|
32460
32483
|
setShouldAnimate(true);
|
|
@@ -32475,7 +32498,7 @@ var OGMetadata = function OGMetadata(_ref) {
|
|
|
32475
32498
|
});
|
|
32476
32499
|
}
|
|
32477
32500
|
}
|
|
32478
|
-
}, [attachment
|
|
32501
|
+
}, [attachment, metadata, handleMetadata, ogMetadataQueryBuilder]);
|
|
32479
32502
|
var ogUrl = React.useMemo(function () {
|
|
32480
32503
|
var url = attachment === null || attachment === void 0 ? void 0 : attachment.url;
|
|
32481
32504
|
var urlObj = validateUrl(url);
|
|
@@ -32483,132 +32506,206 @@ var OGMetadata = function OGMetadata(_ref) {
|
|
|
32483
32506
|
return urlObj.hostname;
|
|
32484
32507
|
}
|
|
32485
32508
|
return url;
|
|
32486
|
-
}, [attachment
|
|
32509
|
+
}, [attachment]);
|
|
32487
32510
|
var showOGMetadata = React.useMemo(function () {
|
|
32488
|
-
var _metadata$og2, _metadata$og3;
|
|
32489
|
-
return state !== 'deleted' && (metadata === null || metadata === void 0 ? void 0 : (_metadata$og2 = metadata.og) === null || _metadata$og2 === void 0 ? void 0 : _metadata$og2.title)
|
|
32511
|
+
var _metadata$og2, _metadata$og3, _metadata$og4, _metadata$og4$image, _metadata$og4$image$, _metadata$og5, _metadata$og5$favicon;
|
|
32512
|
+
return state !== 'deleted' && ((metadata === null || metadata === void 0 ? void 0 : (_metadata$og2 = metadata.og) === null || _metadata$og2 === void 0 ? void 0 : _metadata$og2.title) || (metadata === null || metadata === void 0 ? void 0 : (_metadata$og3 = metadata.og) === null || _metadata$og3 === void 0 ? void 0 : _metadata$og3.description) || (metadata === null || metadata === void 0 ? void 0 : (_metadata$og4 = metadata.og) === null || _metadata$og4 === void 0 ? void 0 : (_metadata$og4$image = _metadata$og4.image) === null || _metadata$og4$image === void 0 ? void 0 : (_metadata$og4$image$ = _metadata$og4$image[0]) === null || _metadata$og4$image$ === void 0 ? void 0 : _metadata$og4$image$.url) || (metadata === null || metadata === void 0 ? void 0 : (_metadata$og5 = metadata.og) === null || _metadata$og5 === void 0 ? void 0 : (_metadata$og5$favicon = _metadata$og5.favicon) === null || _metadata$og5$favicon === void 0 ? void 0 : _metadata$og5$favicon.url)) && metadata;
|
|
32490
32513
|
}, [state, metadata]);
|
|
32491
32514
|
var calculatedImageHeight = React.useMemo(function () {
|
|
32492
|
-
if (!(metadata !== null && metadata !== void 0 && metadata.imageWidth)) {
|
|
32515
|
+
if (!(metadata !== null && metadata !== void 0 && metadata.imageWidth) || !(metadata !== null && metadata !== void 0 && metadata.imageHeight)) {
|
|
32493
32516
|
return 0;
|
|
32494
32517
|
}
|
|
32495
|
-
return (metadata === null || metadata === void 0 ? void 0 : metadata.imageHeight) / ((metadata === null || metadata === void 0 ? void 0 : metadata.imageWidth) /
|
|
32496
|
-
}, [metadata === null || metadata === void 0 ? void 0 : metadata.imageWidth, metadata === null || metadata === void 0 ? void 0 : metadata.imageHeight]);
|
|
32497
|
-
|
|
32518
|
+
return (metadata === null || metadata === void 0 ? void 0 : metadata.imageHeight) / ((metadata === null || metadata === void 0 ? void 0 : metadata.imageWidth) / maxWidth);
|
|
32519
|
+
}, [metadata === null || metadata === void 0 ? void 0 : metadata.imageWidth, metadata === null || metadata === void 0 ? void 0 : metadata.imageHeight, maxWidth]);
|
|
32520
|
+
var hasImage = React.useMemo(function () {
|
|
32521
|
+
var _metadata$og6, _metadata$og6$image, _metadata$og6$image$;
|
|
32522
|
+
return (metadata === null || metadata === void 0 ? void 0 : (_metadata$og6 = metadata.og) === null || _metadata$og6 === void 0 ? void 0 : (_metadata$og6$image = _metadata$og6.image) === null || _metadata$og6$image === void 0 ? void 0 : (_metadata$og6$image$ = _metadata$og6$image[0]) === null || _metadata$og6$image$ === void 0 ? void 0 : _metadata$og6$image$.url) && !imageLoadError;
|
|
32523
|
+
}, [metadata === null || metadata === void 0 ? void 0 : (_metadata$og7 = metadata.og) === null || _metadata$og7 === void 0 ? void 0 : (_metadata$og7$image = _metadata$og7.image) === null || _metadata$og7$image === void 0 ? void 0 : (_metadata$og7$image$ = _metadata$og7$image[0]) === null || _metadata$og7$image$ === void 0 ? void 0 : _metadata$og7$image$.url, imageLoadError]);
|
|
32524
|
+
var faviconUrl = React.useMemo(function () {
|
|
32525
|
+
var _metadata$og8, _metadata$og8$favicon;
|
|
32526
|
+
return metadata === null || metadata === void 0 ? void 0 : (_metadata$og8 = metadata.og) === null || _metadata$og8 === void 0 ? void 0 : (_metadata$og8$favicon = _metadata$og8.favicon) === null || _metadata$og8$favicon === void 0 ? void 0 : _metadata$og8$favicon.url;
|
|
32527
|
+
}, [metadata === null || metadata === void 0 ? void 0 : (_metadata$og9 = metadata.og) === null || _metadata$og9 === void 0 ? void 0 : (_metadata$og9$favicon = _metadata$og9.favicon) === null || _metadata$og9$favicon === void 0 ? void 0 : _metadata$og9$favicon.url]);
|
|
32528
|
+
var resolvedOrder = React.useMemo(function () {
|
|
32529
|
+
return order || {
|
|
32530
|
+
image: 1,
|
|
32531
|
+
title: 2,
|
|
32532
|
+
description: 3,
|
|
32533
|
+
link: 4
|
|
32534
|
+
};
|
|
32535
|
+
}, [order]);
|
|
32536
|
+
var elements = React.useMemo(function () {
|
|
32537
|
+
var _resolvedOrder$image, _metadata$og0, _metadata$og0$image, _metadata$og0$image$, _resolvedOrder$title, _metadata$og1, _metadata$og10, _resolvedOrder$descri, _metadata$og11, _metadata$og12, _resolvedOrder$link;
|
|
32538
|
+
return [hasImage ? {
|
|
32539
|
+
key: 'image',
|
|
32540
|
+
order: (_resolvedOrder$image = resolvedOrder === null || resolvedOrder === void 0 ? void 0 : resolvedOrder.image) != null ? _resolvedOrder$image : 1,
|
|
32541
|
+
render: (/*#__PURE__*/React__default.createElement(ImageContainer, {
|
|
32542
|
+
showOGMetadata: !!showOGMetadata,
|
|
32543
|
+
containerWidth: maxWidth,
|
|
32544
|
+
containerHeight: calculatedImageHeight,
|
|
32545
|
+
shouldAnimate: shouldAnimate,
|
|
32546
|
+
maxWidth: maxWidth,
|
|
32547
|
+
maxHeight: maxHeight || calculatedImageHeight
|
|
32548
|
+
}, /*#__PURE__*/React__default.createElement(Img, {
|
|
32549
|
+
src: metadata === null || metadata === void 0 ? void 0 : (_metadata$og0 = metadata.og) === null || _metadata$og0 === void 0 ? void 0 : (_metadata$og0$image = _metadata$og0.image) === null || _metadata$og0$image === void 0 ? void 0 : (_metadata$og0$image$ = _metadata$og0$image[0]) === null || _metadata$og0$image$ === void 0 ? void 0 : _metadata$og0$image$.url,
|
|
32550
|
+
alt: 'OG image',
|
|
32551
|
+
shouldAnimate: shouldAnimate
|
|
32552
|
+
})))
|
|
32553
|
+
} : null, {
|
|
32554
|
+
key: 'title',
|
|
32555
|
+
order: (_resolvedOrder$title = resolvedOrder === null || resolvedOrder === void 0 ? void 0 : resolvedOrder.title) != null ? _resolvedOrder$title : 2,
|
|
32556
|
+
render: ogShowTitle && (metadata === null || metadata === void 0 ? void 0 : (_metadata$og1 = metadata.og) === null || _metadata$og1 === void 0 ? void 0 : _metadata$og1.title) && (/*#__PURE__*/React__default.createElement(Title$2, {
|
|
32557
|
+
maxWidth: maxWidth,
|
|
32558
|
+
shouldAnimate: shouldAnimate,
|
|
32559
|
+
padding: infoPadding
|
|
32560
|
+
}, /*#__PURE__*/React__default.createElement("span", null, metadata === null || metadata === void 0 ? void 0 : (_metadata$og10 = metadata.og) === null || _metadata$og10 === void 0 ? void 0 : _metadata$og10.title)))
|
|
32561
|
+
}, {
|
|
32562
|
+
key: 'description',
|
|
32563
|
+
order: (_resolvedOrder$descri = resolvedOrder === null || resolvedOrder === void 0 ? void 0 : resolvedOrder.description) != null ? _resolvedOrder$descri : 3,
|
|
32564
|
+
render: ogShowDescription && (metadata === null || metadata === void 0 ? void 0 : (_metadata$og11 = metadata.og) === null || _metadata$og11 === void 0 ? void 0 : _metadata$og11.description) && (/*#__PURE__*/React__default.createElement(Desc, {
|
|
32565
|
+
maxWidth: maxWidth,
|
|
32566
|
+
shouldAnimate: shouldAnimate,
|
|
32567
|
+
color: textSecondary,
|
|
32568
|
+
padding: infoPadding
|
|
32569
|
+
}, metadata === null || metadata === void 0 ? void 0 : (_metadata$og12 = metadata.og) === null || _metadata$og12 === void 0 ? void 0 : _metadata$og12.description))
|
|
32570
|
+
}, {
|
|
32571
|
+
key: 'link',
|
|
32572
|
+
order: (_resolvedOrder$link = resolvedOrder === null || resolvedOrder === void 0 ? void 0 : resolvedOrder.link) != null ? _resolvedOrder$link : 4,
|
|
32573
|
+
render: ogShowUrl && (/*#__PURE__*/React__default.createElement(Url, {
|
|
32574
|
+
maxWidth: maxWidth,
|
|
32575
|
+
shouldAnimate: shouldAnimate,
|
|
32576
|
+
padding: infoPadding
|
|
32577
|
+
}, ogUrl))
|
|
32578
|
+
}].filter(function (el) {
|
|
32579
|
+
return !!el;
|
|
32580
|
+
}).sort(function (a, b) {
|
|
32581
|
+
var _a$order, _b$order;
|
|
32582
|
+
return ((_a$order = a.order) != null ? _a$order : 0) - ((_b$order = b.order) != null ? _b$order : 0);
|
|
32583
|
+
});
|
|
32584
|
+
}, [hasImage, resolvedOrder, showOGMetadata, maxWidth, calculatedImageHeight, maxHeight, metadata === null || metadata === void 0 ? void 0 : (_metadata$og13 = metadata.og) === null || _metadata$og13 === void 0 ? void 0 : _metadata$og13.image, shouldAnimate, ogShowTitle, metadata === null || metadata === void 0 ? void 0 : (_metadata$og14 = metadata.og) === null || _metadata$og14 === void 0 ? void 0 : _metadata$og14.title, infoPadding, ogShowDescription, metadata === null || metadata === void 0 ? void 0 : (_metadata$og15 = metadata.og) === null || _metadata$og15 === void 0 ? void 0 : _metadata$og15.description, textSecondary, ogShowUrl, ogUrl]);
|
|
32585
|
+
var textContent = React.useMemo(function () {
|
|
32586
|
+
return /*#__PURE__*/React__default.createElement(OGText, {
|
|
32587
|
+
shouldAnimate: shouldAnimate,
|
|
32588
|
+
margin: ogContainerShowBackground
|
|
32589
|
+
}, elements.filter(function (el) {
|
|
32590
|
+
return el.key !== 'image';
|
|
32591
|
+
}).map(function (el) {
|
|
32592
|
+
return /*#__PURE__*/React__default.createElement(React__default.Fragment, {
|
|
32593
|
+
key: el.key
|
|
32594
|
+
}, el.render);
|
|
32595
|
+
}));
|
|
32596
|
+
}, [elements, shouldAnimate, ogContainerShowBackground]);
|
|
32597
|
+
var content = React.useMemo(function () {
|
|
32598
|
+
return hasImage ? (/*#__PURE__*/React__default.createElement(OGText, {
|
|
32599
|
+
shouldAnimate: shouldAnimate,
|
|
32600
|
+
margin: ogContainerShowBackground
|
|
32601
|
+
}, elements.map(function (el) {
|
|
32602
|
+
return /*#__PURE__*/React__default.createElement(React__default.Fragment, {
|
|
32603
|
+
key: el.key
|
|
32604
|
+
}, el.render);
|
|
32605
|
+
}))) : ogShowFavicon && faviconUrl ? (/*#__PURE__*/React__default.createElement(OGRow, null, /*#__PURE__*/React__default.createElement(OGTextWrapper, null, textContent), /*#__PURE__*/React__default.createElement(FaviconContainer, {
|
|
32606
|
+
"aria-hidden": 'true'
|
|
32607
|
+
}, /*#__PURE__*/React__default.createElement(FaviconImg, {
|
|
32608
|
+
src: faviconUrl,
|
|
32609
|
+
alt: ''
|
|
32610
|
+
})))) : textContent;
|
|
32611
|
+
}, [hasImage, elements, shouldAnimate, ogContainerShowBackground, ogShowFavicon, faviconUrl, textContent]);
|
|
32612
|
+
return /*#__PURE__*/React__default.createElement("div", {
|
|
32613
|
+
className: 'ogmetadata-container'
|
|
32614
|
+
}, /*#__PURE__*/React__default.createElement(OGMetadataContainer, {
|
|
32498
32615
|
showOGMetadata: !!showOGMetadata,
|
|
32499
|
-
bgColor: incoming ? incomingMessageBackgroundX : outgoingMessageBackgroundX
|
|
32500
|
-
|
|
32501
|
-
|
|
32502
|
-
|
|
32503
|
-
|
|
32504
|
-
|
|
32505
|
-
|
|
32506
|
-
|
|
32507
|
-
|
|
32508
|
-
|
|
32509
|
-
|
|
32510
|
-
|
|
32511
|
-
|
|
32512
|
-
|
|
32513
|
-
|
|
32514
|
-
|
|
32515
|
-
|
|
32516
|
-
|
|
32517
|
-
|
|
32518
|
-
})) : null), showOGMetadata ? (/*#__PURE__*/React__default.createElement(OGText, {
|
|
32519
|
-
shouldAnimate: shouldAnimate
|
|
32520
|
-
}, /*#__PURE__*/React__default.createElement(Url, {
|
|
32521
|
-
maxWidth: 400,
|
|
32522
|
-
shouldAnimate: shouldAnimate
|
|
32523
|
-
}, ogUrl), metadata !== null && metadata !== void 0 && (_metadata$og6 = metadata.og) !== null && _metadata$og6 !== void 0 && _metadata$og6.title ? (/*#__PURE__*/React__default.createElement(Title$2, {
|
|
32524
|
-
maxWidth: 400,
|
|
32525
|
-
shouldAnimate: shouldAnimate
|
|
32526
|
-
}, metadata !== null && metadata !== void 0 && (_metadata$og7 = metadata.og) !== null && _metadata$og7 !== void 0 && (_metadata$og7$favicon = _metadata$og7.favicon) !== null && _metadata$og7$favicon !== void 0 && _metadata$og7$favicon.url && !faviconLoadError ? (/*#__PURE__*/React__default.createElement(Favicon, {
|
|
32527
|
-
shouldAnimate: shouldAnimate,
|
|
32528
|
-
src: metadata === null || metadata === void 0 ? void 0 : (_metadata$og8 = metadata.og) === null || _metadata$og8 === void 0 ? void 0 : (_metadata$og8$favicon = _metadata$og8.favicon) === null || _metadata$og8$favicon === void 0 ? void 0 : _metadata$og8$favicon.url,
|
|
32529
|
-
onLoad: function onLoad() {
|
|
32530
|
-
return setFaviconLoadError(false);
|
|
32531
|
-
},
|
|
32532
|
-
onError: function onError() {
|
|
32533
|
-
dispatch(updateOGMetadataAC(attachment === null || attachment === void 0 ? void 0 : attachment.url, _extends({}, metadata, {
|
|
32534
|
-
og: _extends({}, metadata === null || metadata === void 0 ? void 0 : metadata.og, {
|
|
32535
|
-
favicon: {
|
|
32536
|
-
url: ''
|
|
32537
|
-
}
|
|
32538
|
-
})
|
|
32539
|
-
})));
|
|
32540
|
-
setFaviconLoadError(true);
|
|
32541
|
-
}
|
|
32542
|
-
})) : null, /*#__PURE__*/React__default.createElement("span", null, metadata === null || metadata === void 0 ? void 0 : (_metadata$og9 = metadata.og) === null || _metadata$og9 === void 0 ? void 0 : _metadata$og9.title))) : null, metadata !== null && metadata !== void 0 && (_metadata$og0 = metadata.og) !== null && _metadata$og0 !== void 0 && _metadata$og0.description ? (/*#__PURE__*/React__default.createElement(Desc, {
|
|
32543
|
-
maxWidth: 400,
|
|
32544
|
-
shouldAnimate: shouldAnimate
|
|
32545
|
-
}, metadata === null || metadata === void 0 ? void 0 : (_metadata$og1 = metadata.og) === null || _metadata$og1 === void 0 ? void 0 : _metadata$og1.description)) : null)) : null));
|
|
32546
|
-
};
|
|
32547
|
-
var OGMetadataContainer = styled__default.div(_templateObject$C || (_templateObject$C = _taggedTemplateLiteralLoose(["\n min-width: inherit;\n max-width: inherit;\n display: grid;\n grid-template-columns: 1fr;\n background-color: ", ";\n border-radius: 6px;\n margin-bottom: 0.4rem;\n margin: 0 auto;\n margin-bottom: ", ";\n &:hover {\n opacity: 0.9;\n cursor: pointer;\n }\n"])), function (_ref2) {
|
|
32548
|
-
var bgColor = _ref2.bgColor;
|
|
32549
|
-
return bgColor;
|
|
32616
|
+
bgColor: incoming ? incomingMessageBackgroundX : outgoingMessageBackgroundX,
|
|
32617
|
+
showBackground: ogContainerShowBackground,
|
|
32618
|
+
customBg: ogContainerBackground,
|
|
32619
|
+
borderRadius: ogContainerBorderRadius,
|
|
32620
|
+
padding: ogContainerPadding,
|
|
32621
|
+
className: ogContainerClassName,
|
|
32622
|
+
containerMargin: ogContainerMargin,
|
|
32623
|
+
as: "a",
|
|
32624
|
+
href: attachment === null || attachment === void 0 ? void 0 : attachment.url,
|
|
32625
|
+
target: target,
|
|
32626
|
+
rel: target === '_blank' ? 'noopener noreferrer' : undefined
|
|
32627
|
+
}, content));
|
|
32628
|
+
};
|
|
32629
|
+
var sharedKeyframes = "\n @keyframes fadeInSlideUp {\n from {\n opacity: 0;\n transform: translateY(10px);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n }\n\n @keyframes fadeIn {\n from {\n opacity: 0;\n }\n to {\n opacity: 1;\n }\n }\n\n @keyframes expandHeight {\n from {\n max-height: 0;\n opacity: 0;\n }\n to {\n max-height: 1000px;\n opacity: 1;\n }\n }\n";
|
|
32630
|
+
var OGMetadataContainer = styled__default.div(_templateObject$C || (_templateObject$C = _taggedTemplateLiteralLoose(["\n min-width: inherit;\n max-width: inherit;\n width: 100%;\n display: grid;\n grid-template-columns: 1fr;\n background-color: ", ";\n border-radius: ", ";\n margin: ", ";\n // margin-bottom: ", ";\n padding: ", ";\n text-decoration: none;\n color: inherit;\n &:hover {\n opacity: 0.9;\n cursor: pointer;\n }\n"])), function (_ref2) {
|
|
32631
|
+
var showBackground = _ref2.showBackground,
|
|
32632
|
+
customBg = _ref2.customBg,
|
|
32633
|
+
bgColor = _ref2.bgColor;
|
|
32634
|
+
return showBackground ? customBg != null ? customBg : bgColor : 'transparent';
|
|
32550
32635
|
}, function (_ref3) {
|
|
32551
|
-
var
|
|
32552
|
-
return
|
|
32553
|
-
})
|
|
32554
|
-
var
|
|
32555
|
-
|
|
32556
|
-
return containerWidth ? "\n max-width: " + (containerWidth + "px") + ";\n " : "\n max-width: 100%;\n width: 100%;\n ";
|
|
32636
|
+
var borderRadius = _ref3.borderRadius;
|
|
32637
|
+
return borderRadius !== undefined ? borderRadius : '8px';
|
|
32638
|
+
}, function (_ref4) {
|
|
32639
|
+
var containerMargin = _ref4.containerMargin;
|
|
32640
|
+
return containerMargin != null ? containerMargin : '0.8rem auto 0';
|
|
32557
32641
|
}, function (_ref5) {
|
|
32558
|
-
var
|
|
32559
|
-
|
|
32560
|
-
return containerHeight ? "\n max-height: " + (containerHeight + "px") + ";\n height: " + (showOGMetadata ? containerHeight + "px" : '0') + ";\n " : "\n height: 0;\n ";
|
|
32642
|
+
var showOGMetadata = _ref5.showOGMetadata;
|
|
32643
|
+
return showOGMetadata ? '0.4rem' : '0';
|
|
32561
32644
|
}, function (_ref6) {
|
|
32562
|
-
var
|
|
32563
|
-
|
|
32564
|
-
return showOGMetadata && containerHeight ? 1 : 0;
|
|
32565
|
-
}, function (_ref7) {
|
|
32566
|
-
var showOGMetadata = _ref7.showOGMetadata,
|
|
32567
|
-
containerHeight = _ref7.containerHeight;
|
|
32568
|
-
return showOGMetadata && containerHeight ? '4px' : '0';
|
|
32569
|
-
}, function (_ref8) {
|
|
32570
|
-
var shouldAnimate = _ref8.shouldAnimate;
|
|
32571
|
-
return shouldAnimate && "\n transition: height 0.2s ease;\n ";
|
|
32645
|
+
var padding = _ref6.padding;
|
|
32646
|
+
return padding != null ? padding : '0';
|
|
32572
32647
|
});
|
|
32573
|
-
var
|
|
32574
|
-
var
|
|
32575
|
-
return
|
|
32576
|
-
})
|
|
32577
|
-
var
|
|
32578
|
-
|
|
32579
|
-
return
|
|
32648
|
+
var ImageContainer = styled__default.div(_templateObject2$x || (_templateObject2$x = _taggedTemplateLiteralLoose(["\n ", "\n width: 100%;\n height: ", ";\n opacity: ", ";\n margin: 0 auto;\n overflow: hidden;\n ", "\n"])), sharedKeyframes, function (_ref7) {
|
|
32649
|
+
var containerHeight = _ref7.containerHeight;
|
|
32650
|
+
return containerHeight ? containerHeight + "px" : '0px';
|
|
32651
|
+
}, function (_ref8) {
|
|
32652
|
+
var showOGMetadata = _ref8.showOGMetadata,
|
|
32653
|
+
containerHeight = _ref8.containerHeight;
|
|
32654
|
+
return showOGMetadata && containerHeight ? 1 : 0;
|
|
32655
|
+
}, function (_ref9) {
|
|
32656
|
+
var shouldAnimate = _ref9.shouldAnimate,
|
|
32657
|
+
showOGMetadata = _ref9.showOGMetadata,
|
|
32658
|
+
containerHeight = _ref9.containerHeight;
|
|
32659
|
+
return shouldAnimate && showOGMetadata && containerHeight && "\n animation: expandHeight 0.3s ease-out forwards;\n ";
|
|
32660
|
+
});
|
|
32661
|
+
var OGText = styled__default.div(_templateObject3$r || (_templateObject3$r = _taggedTemplateLiteralLoose(["\n ", "\n display: flex;\n flex-direction: column;\n gap: 0;\n ", "\n ", ";\n"])), sharedKeyframes, function (_ref0) {
|
|
32662
|
+
var shouldAnimate = _ref0.shouldAnimate;
|
|
32663
|
+
return shouldAnimate && "\n animation: fadeInSlideUp 0.3s ease-out forwards;\n ";
|
|
32580
32664
|
}, function (_ref1) {
|
|
32581
|
-
var
|
|
32582
|
-
return
|
|
32665
|
+
var margin = _ref1.margin;
|
|
32666
|
+
return margin ? '12px' : '0';
|
|
32583
32667
|
});
|
|
32584
|
-
var Title$2 = styled__default.p(
|
|
32585
|
-
var
|
|
32586
|
-
return
|
|
32668
|
+
var Title$2 = styled__default.p(_templateObject4$n || (_templateObject4$n = _taggedTemplateLiteralLoose(["\n ", "\n font-weight: bold;\n font-size: 13px;\n line-height: 16px;\n margin: 8px 0 0 0;\n padding: ", ";\n box-sizing: border-box;\n ", "\n ", "\n"])), sharedKeyframes, function (_ref10) {
|
|
32669
|
+
var padding = _ref10.padding;
|
|
32670
|
+
return padding != null ? padding : '0';
|
|
32587
32671
|
}, function (_ref11) {
|
|
32588
|
-
var
|
|
32589
|
-
return
|
|
32590
|
-
})
|
|
32591
|
-
var
|
|
32592
|
-
|
|
32593
|
-
|
|
32594
|
-
|
|
32595
|
-
var
|
|
32596
|
-
return
|
|
32597
|
-
})
|
|
32598
|
-
var
|
|
32599
|
-
|
|
32600
|
-
return imageWidth && "\n max-width: 100%;\n width: " + ("calc(" + imageWidth + "px - 8px)") + ";\n ";
|
|
32672
|
+
var maxWidth = _ref11.maxWidth;
|
|
32673
|
+
return maxWidth && "\n max-width: " + maxWidth + "px;\n ";
|
|
32674
|
+
}, function (_ref12) {
|
|
32675
|
+
var shouldAnimate = _ref12.shouldAnimate;
|
|
32676
|
+
return shouldAnimate && "\n animation: fadeInSlideUp 0.3s ease-out 0.1s backwards;\n ";
|
|
32677
|
+
});
|
|
32678
|
+
var Desc = styled__default.p(_templateObject5$i || (_templateObject5$i = _taggedTemplateLiteralLoose(["\n ", "\n font-weight: normal;\n font-size: 13px;\n line-height: 16px;\n margin: 0 0 8px 0;\n padding: ", ";\n color: ", ";\n display: -webkit-box;\n -webkit-line-clamp: 3;\n -webkit-box-orient: vertical;\n overflow: hidden;\n box-sizing: border-box;\n ", "\n ", "\n"])), sharedKeyframes, function (_ref13) {
|
|
32679
|
+
var padding = _ref13.padding;
|
|
32680
|
+
return padding != null ? padding : '0';
|
|
32681
|
+
}, function (_ref14) {
|
|
32682
|
+
var color = _ref14.color;
|
|
32683
|
+
return color;
|
|
32601
32684
|
}, function (_ref15) {
|
|
32602
|
-
var
|
|
32603
|
-
return
|
|
32685
|
+
var maxWidth = _ref15.maxWidth;
|
|
32686
|
+
return maxWidth && "\n max-width: " + maxWidth + "px;\n ";
|
|
32604
32687
|
}, function (_ref16) {
|
|
32605
32688
|
var shouldAnimate = _ref16.shouldAnimate;
|
|
32606
|
-
return shouldAnimate && "\n
|
|
32607
|
-
});
|
|
32608
|
-
var
|
|
32609
|
-
var
|
|
32610
|
-
return
|
|
32611
|
-
})
|
|
32689
|
+
return shouldAnimate && "\n animation: fadeInSlideUp 0.3s ease-out 0.2s backwards;\n ";
|
|
32690
|
+
});
|
|
32691
|
+
var Url = styled__default.p(_templateObject6$g || (_templateObject6$g = _taggedTemplateLiteralLoose(["\n ", "\n font-weight: normal;\n font-size: 13px;\n line-height: 16px;\n margin: 0 0 12px 0;\n padding: ", ";\n color: gray;\n box-sizing: border-box;\n ", "\n ", "\n"])), sharedKeyframes, function (_ref17) {
|
|
32692
|
+
var padding = _ref17.padding;
|
|
32693
|
+
return padding != null ? padding : '0';
|
|
32694
|
+
}, function (_ref18) {
|
|
32695
|
+
var maxWidth = _ref18.maxWidth;
|
|
32696
|
+
return maxWidth && "\n max-width: " + maxWidth + "px;\n ";
|
|
32697
|
+
}, function (_ref19) {
|
|
32698
|
+
var shouldAnimate = _ref19.shouldAnimate;
|
|
32699
|
+
return shouldAnimate && "\n animation: fadeInSlideUp 0.3s ease-out 0.3s backwards;\n ";
|
|
32700
|
+
});
|
|
32701
|
+
var Img = styled__default.img(_templateObject7$e || (_templateObject7$e = _taggedTemplateLiteralLoose(["\n ", "\n width: 100%;\n height: 100%;\n object-fit: cover;\n display: block;\n border-radius: inherit;\n ", "\n"])), sharedKeyframes, function (_ref20) {
|
|
32702
|
+
var shouldAnimate = _ref20.shouldAnimate;
|
|
32703
|
+
return shouldAnimate && "\n animation: fadeIn 0.4s ease-out forwards;\n ";
|
|
32704
|
+
});
|
|
32705
|
+
var OGRow = styled__default.div(_templateObject8$d || (_templateObject8$d = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: flex-start;\n justify-content: space-between;\n"])));
|
|
32706
|
+
var OGTextWrapper = styled__default.div(_templateObject9$b || (_templateObject9$b = _taggedTemplateLiteralLoose(["\n flex: 1 1 auto;\n"])));
|
|
32707
|
+
var FaviconContainer = styled__default.div(_templateObject0$a || (_templateObject0$a = _taggedTemplateLiteralLoose(["\n width: 52px;\n height: 52px;\n border-radius: 8px;\n overflow: hidden;\n margin: 12px;\n flex: 0 0 52px;\n"])));
|
|
32708
|
+
var FaviconImg = styled__default.img(_templateObject1$7 || (_templateObject1$7 = _taggedTemplateLiteralLoose(["\n width: 100%;\n height: 100%;\n object-fit: cover;\n display: block;\n"])));
|
|
32612
32709
|
|
|
32613
32710
|
var _templateObject$D, _templateObject2$y, _templateObject3$s, _templateObject4$o, _templateObject5$j;
|
|
32614
32711
|
var MessageBody = function MessageBody(_ref) {
|
|
@@ -32753,6 +32850,7 @@ var MessageBody = function MessageBody(_ref) {
|
|
|
32753
32850
|
messageTextRef = _ref.messageTextRef,
|
|
32754
32851
|
handleOpenUserProfile = _ref.handleOpenUserProfile,
|
|
32755
32852
|
shouldOpenUserProfileForMention = _ref.shouldOpenUserProfileForMention,
|
|
32853
|
+
ogMetadataProps = _ref.ogMetadataProps,
|
|
32756
32854
|
unsupportedMessage = _ref.unsupportedMessage;
|
|
32757
32855
|
var _useColor = useColors(),
|
|
32758
32856
|
accentColor = _useColor[THEME_COLORS.ACCENT],
|
|
@@ -32800,6 +32898,10 @@ var MessageBody = function MessageBody(_ref) {
|
|
|
32800
32898
|
var linkAttachment = message.attachments.find(function (a) {
|
|
32801
32899
|
return a.type === attachmentTypes.link;
|
|
32802
32900
|
});
|
|
32901
|
+
var ogContainerOrder = ogMetadataProps && ogMetadataProps.ogLayoutOrder || 'og-first';
|
|
32902
|
+
var ogContainerFirst = React.useMemo(function () {
|
|
32903
|
+
return ogContainerOrder === 'og-first';
|
|
32904
|
+
}, [ogContainerOrder]);
|
|
32803
32905
|
var messageOwnerIsNotCurrentUser = !!(message.user && message.user.id !== user.id && message.user.id);
|
|
32804
32906
|
var mediaAttachment = React.useMemo(function () {
|
|
32805
32907
|
return withAttachments && message.attachments.find(function (attachment) {
|
|
@@ -32986,10 +33088,28 @@ var MessageBody = function MessageBody(_ref) {
|
|
|
32986
33088
|
linkColor: linkColor,
|
|
32987
33089
|
unsupportedMessage: unsupportedMessage,
|
|
32988
33090
|
unsupportedMessageColor: textSecondary
|
|
32989
|
-
}, linkAttachment && (/*#__PURE__*/React__default.createElement(OGMetadata, {
|
|
33091
|
+
}, ogContainerFirst && linkAttachment && (/*#__PURE__*/React__default.createElement(OGMetadata, {
|
|
33092
|
+
maxWidth: (ogMetadataProps === null || ogMetadataProps === void 0 ? void 0 : ogMetadataProps.maxWidth) || 400,
|
|
33093
|
+
maxHeight: ogMetadataProps === null || ogMetadataProps === void 0 ? void 0 : ogMetadataProps.maxHeight,
|
|
32990
33094
|
attachments: [linkAttachment],
|
|
32991
33095
|
state: message.state,
|
|
32992
|
-
incoming: message.incoming
|
|
33096
|
+
incoming: message.incoming,
|
|
33097
|
+
ogShowUrl: ogMetadataProps ? ogMetadataProps.ogShowUrl : undefined,
|
|
33098
|
+
ogShowTitle: ogMetadataProps ? ogMetadataProps.ogShowTitle : undefined,
|
|
33099
|
+
ogShowDescription: ogMetadataProps ? ogMetadataProps.ogShowDescription : undefined,
|
|
33100
|
+
ogShowFavicon: ogMetadataProps ? ogMetadataProps.ogShowFavicon : undefined,
|
|
33101
|
+
order: (ogMetadataProps === null || ogMetadataProps === void 0 ? void 0 : ogMetadataProps.order) || {
|
|
33102
|
+
image: 3,
|
|
33103
|
+
title: 1,
|
|
33104
|
+
description: 2,
|
|
33105
|
+
link: 4
|
|
33106
|
+
},
|
|
33107
|
+
ogContainerBorderRadius: ogMetadataProps === null || ogMetadataProps === void 0 ? void 0 : ogMetadataProps.ogContainerBorderRadius,
|
|
33108
|
+
ogContainerPadding: ogMetadataProps === null || ogMetadataProps === void 0 ? void 0 : ogMetadataProps.ogContainerPadding,
|
|
33109
|
+
ogContainerClassName: ogMetadataProps === null || ogMetadataProps === void 0 ? void 0 : ogMetadataProps.ogContainerClassName,
|
|
33110
|
+
ogContainerShowBackground: ogMetadataProps === null || ogMetadataProps === void 0 ? void 0 : ogMetadataProps.ogContainerShowBackground,
|
|
33111
|
+
ogContainerBackground: ogMetadataProps === null || ogMetadataProps === void 0 ? void 0 : ogMetadataProps.ogContainerBackground,
|
|
33112
|
+
infoPadding: ogMetadataProps === null || ogMetadataProps === void 0 ? void 0 : ogMetadataProps.infoPadding
|
|
32993
33113
|
})), /*#__PURE__*/React__default.createElement("span", {
|
|
32994
33114
|
ref: messageTextRef
|
|
32995
33115
|
}, MessageTextFormat({
|
|
@@ -33004,7 +33124,29 @@ var MessageBody = function MessageBody(_ref) {
|
|
|
33004
33124
|
unsupportedMessage: unsupportedMessage
|
|
33005
33125
|
})), !withAttachments && message.state === MESSAGE_STATUS.DELETE ? (/*#__PURE__*/React__default.createElement(MessageStatusDeleted$1, {
|
|
33006
33126
|
color: textSecondary
|
|
33007
|
-
}, " Message was deleted. ")) : '',
|
|
33127
|
+
}, " Message was deleted. ")) : '', !ogContainerFirst && linkAttachment && (/*#__PURE__*/React__default.createElement(OGMetadata, {
|
|
33128
|
+
maxWidth: (ogMetadataProps === null || ogMetadataProps === void 0 ? void 0 : ogMetadataProps.maxWidth) || 400,
|
|
33129
|
+
maxHeight: ogMetadataProps === null || ogMetadataProps === void 0 ? void 0 : ogMetadataProps.maxHeight,
|
|
33130
|
+
attachments: [linkAttachment],
|
|
33131
|
+
state: message.state,
|
|
33132
|
+
incoming: message.incoming,
|
|
33133
|
+
ogShowUrl: ogMetadataProps ? ogMetadataProps.ogShowUrl : undefined,
|
|
33134
|
+
ogShowTitle: ogMetadataProps ? ogMetadataProps.ogShowTitle : undefined,
|
|
33135
|
+
ogShowDescription: ogMetadataProps ? ogMetadataProps.ogShowDescription : undefined,
|
|
33136
|
+
ogShowFavicon: ogMetadataProps ? ogMetadataProps.ogShowFavicon : undefined,
|
|
33137
|
+
order: (ogMetadataProps === null || ogMetadataProps === void 0 ? void 0 : ogMetadataProps.order) || {
|
|
33138
|
+
image: 1,
|
|
33139
|
+
title: 2,
|
|
33140
|
+
description: 3,
|
|
33141
|
+
link: 4
|
|
33142
|
+
},
|
|
33143
|
+
ogContainerBorderRadius: ogMetadataProps === null || ogMetadataProps === void 0 ? void 0 : ogMetadataProps.ogContainerBorderRadius,
|
|
33144
|
+
ogContainerPadding: ogMetadataProps === null || ogMetadataProps === void 0 ? void 0 : ogMetadataProps.ogContainerPadding,
|
|
33145
|
+
ogContainerClassName: ogMetadataProps === null || ogMetadataProps === void 0 ? void 0 : ogMetadataProps.ogContainerClassName,
|
|
33146
|
+
ogContainerShowBackground: ogMetadataProps === null || ogMetadataProps === void 0 ? void 0 : ogMetadataProps.ogContainerShowBackground,
|
|
33147
|
+
ogContainerBackground: ogMetadataProps === null || ogMetadataProps === void 0 ? void 0 : ogMetadataProps.ogContainerBackground,
|
|
33148
|
+
infoPadding: ogMetadataProps === null || ogMetadataProps === void 0 ? void 0 : ogMetadataProps.infoPadding
|
|
33149
|
+
})), messageStatusAndTimePosition === 'onMessage' && !notLinkAttachment && (messageStatusVisible || messageTimeVisible) ? (/*#__PURE__*/React__default.createElement(MessageStatusAndTime$1, {
|
|
33008
33150
|
message: message,
|
|
33009
33151
|
showMessageTimeAndStatusOnlyOnHover: showMessageTimeAndStatusOnlyOnHover,
|
|
33010
33152
|
messageStatusDisplayingType: messageStatusDisplayingType,
|
|
@@ -33088,9 +33230,10 @@ var MessageBody = function MessageBody(_ref) {
|
|
|
33088
33230
|
}))));
|
|
33089
33231
|
};
|
|
33090
33232
|
var MessageBody$1 = /*#__PURE__*/React__default.memo(MessageBody, function (prevProps, nextProps) {
|
|
33091
|
-
|
|
33233
|
+
var _prevProps$ogMetadata, _nextProps$ogMetadata, _prevProps$ogMetadata2, _nextProps$ogMetadata2, _prevProps$ogMetadata3, _nextProps$ogMetadata3, _prevProps$ogMetadata4, _nextProps$ogMetadata4, _prevProps$ogMetadata5, _nextProps$ogMetadata5, _prevProps$ogMetadata6, _nextProps$ogMetadata6;
|
|
33234
|
+
return !!(prevProps.message.deliveryStatus === nextProps.message.deliveryStatus && prevProps.message.state === nextProps.message.state && prevProps.message.userReactions === nextProps.message.userReactions && prevProps.message.body === nextProps.message.body && prevProps.message.reactionTotals === nextProps.message.reactionTotals && prevProps.message.attachments === nextProps.message.attachments && prevProps.message.userMarkers === nextProps.message.userMarkers && prevProps.prevMessage === nextProps.prevMessage && prevProps.nextMessage === nextProps.nextMessage && prevProps.selectedMessagesMap === nextProps.selectedMessagesMap && prevProps.contactsMap === nextProps.contactsMap && prevProps.connectionStatus === nextProps.connectionStatus && prevProps.openedMessageMenuId === nextProps.openedMessageMenuId && prevProps.ownMessageOnRightSide === nextProps.ownMessageOnRightSide && prevProps.showSenderNameOnDirectChannel === nextProps.showSenderNameOnDirectChannel && prevProps.showSenderNameOnGroupChannel === nextProps.showSenderNameOnGroupChannel && prevProps.showSenderNameOnOwnMessages === nextProps.showSenderNameOnOwnMessages && prevProps.messageStatusAndTimePosition === nextProps.messageStatusAndTimePosition && prevProps.messageStatusDisplayingType === nextProps.messageStatusDisplayingType && prevProps.outgoingMessageStyles === nextProps.outgoingMessageStyles && prevProps.incomingMessageStyles === nextProps.incomingMessageStyles && prevProps.ownRepliedMessageBackground === nextProps.ownRepliedMessageBackground && prevProps.incomingRepliedMessageBackground === nextProps.incomingRepliedMessageBackground && prevProps.showMessageStatus === nextProps.showMessageStatus && prevProps.showMessageTimeAndStatusOnlyOnHover === nextProps.showMessageTimeAndStatusOnlyOnHover && prevProps.showMessageTime === nextProps.showMessageTime && prevProps.showMessageStatusForEachMessage === nextProps.showMessageStatusForEachMessage && prevProps.showMessageTimeForEachMessage === nextProps.showMessageTimeForEachMessage && prevProps.messageReaction === nextProps.messageReaction && prevProps.editMessage === nextProps.editMessage && prevProps.copyMessage === nextProps.copyMessage && prevProps.replyMessage === nextProps.replyMessage && prevProps.replyMessageInThread === nextProps.replyMessageInThread && prevProps.forwardMessage === nextProps.forwardMessage && prevProps.deleteMessage === nextProps.deleteMessage && prevProps.selectMessage === nextProps.selectMessage && prevProps.allowEditDeleteIncomingMessage === nextProps.allowEditDeleteIncomingMessage && prevProps.reportMessage === nextProps.reportMessage && prevProps.reactionIcon === nextProps.reactionIcon && prevProps.editIcon === nextProps.editIcon && prevProps.copyIcon === nextProps.copyIcon && prevProps.replyIcon === nextProps.replyIcon && prevProps.replyInThreadIcon === nextProps.replyInThreadIcon && prevProps.forwardIcon === nextProps.forwardIcon && prevProps.deleteIcon === nextProps.deleteIcon && prevProps.selectIcon === nextProps.selectIcon && prevProps.starIcon === nextProps.starIcon && prevProps.staredIcon === nextProps.staredIcon && prevProps.reportIcon === nextProps.reportIcon && prevProps.fixEmojiCategoriesTitleOnTop === nextProps.fixEmojiCategoriesTitleOnTop && prevProps.emojisCategoryIconsPosition === nextProps.emojisCategoryIconsPosition && prevProps.emojisContainerBorderRadius === nextProps.emojisContainerBorderRadius && prevProps.reactionIconOrder === nextProps.reactionIconOrder && prevProps.editIconOrder === nextProps.editIconOrder && prevProps.copyIconOrder === nextProps.copyIconOrder && prevProps.replyIconOrder === nextProps.replyIconOrder && prevProps.replyInThreadIconOrder === nextProps.replyInThreadIconOrder && prevProps.forwardIconOrder === nextProps.forwardIconOrder && prevProps.deleteIconOrder === nextProps.deleteIconOrder && prevProps.selectIconOrder === nextProps.selectIconOrder && prevProps.starIconOrder === nextProps.starIconOrder && prevProps.reportIconOrder === nextProps.reportIconOrder && prevProps.reactionIconTooltipText === nextProps.reactionIconTooltipText && prevProps.editIconTooltipText === nextProps.editIconTooltipText && prevProps.copyIconTooltipText === nextProps.copyIconTooltipText && prevProps.replyIconTooltipText === nextProps.replyIconTooltipText && prevProps.replyInThreadIconTooltipText === nextProps.replyInThreadIconTooltipText && prevProps.forwardIconTooltipText === nextProps.forwardIconTooltipText && prevProps.deleteIconTooltipText === nextProps.deleteIconTooltipText && prevProps.selectIconTooltipText === nextProps.selectIconTooltipText && prevProps.starIconTooltipText === nextProps.starIconTooltipText && prevProps.reportIconTooltipText === nextProps.reportIconTooltipText && prevProps.messageActionIconsColor === nextProps.messageActionIconsColor && prevProps.inlineReactionIcon === nextProps.inlineReactionIcon && prevProps.messageStatusSize === nextProps.messageStatusSize && prevProps.messageStatusColor === nextProps.messageStatusColor && prevProps.messageReadStatusColor === nextProps.messageReadStatusColor && prevProps.messageStateFontSize === nextProps.messageStateFontSize && prevProps.messageStateColor === nextProps.messageStateColor && prevProps.messageTimeFontSize === nextProps.messageTimeFontSize && prevProps.messageTimeColor === nextProps.messageTimeColor && prevProps.messageStatusAndTimeLineHeight === nextProps.messageStatusAndTimeLineHeight && prevProps.fileAttachmentsBoxWidth === nextProps.fileAttachmentsBoxWidth && prevProps.fileAttachmentsBoxBackground === nextProps.fileAttachmentsBoxBackground && prevProps.fileAttachmentsBoxBorder === nextProps.fileAttachmentsBoxBorder && prevProps.fileAttachmentsTitleColor === nextProps.fileAttachmentsTitleColor && prevProps.fileAttachmentsSizeColor === nextProps.fileAttachmentsSizeColor && prevProps.fileAttachmentsIcon === nextProps.fileAttachmentsIcon && prevProps.imageAttachmentMaxWidth === nextProps.imageAttachmentMaxWidth && prevProps.imageAttachmentMaxHeight === nextProps.imageAttachmentMaxHeight && prevProps.videoAttachmentMaxWidth === nextProps.videoAttachmentMaxWidth && prevProps.videoAttachmentMaxHeight === nextProps.videoAttachmentMaxHeight && prevProps.theme === nextProps.theme && prevProps.messageTextFontSize === nextProps.messageTextFontSize && prevProps.messageTextLineHeight === nextProps.messageTextLineHeight && prevProps.messageActionsShow === nextProps.messageActionsShow && prevProps.emojisPopupOpen === nextProps.emojisPopupOpen && prevProps.emojisPopupPosition === nextProps.emojisPopupPosition && prevProps.frequentlyEmojisOpen === nextProps.frequentlyEmojisOpen && (((_prevProps$ogMetadata = prevProps.ogMetadataProps) === null || _prevProps$ogMetadata === void 0 ? void 0 : _prevProps$ogMetadata.ogLayoutOrder) || 'og-first') === (((_nextProps$ogMetadata = nextProps.ogMetadataProps) === null || _nextProps$ogMetadata === void 0 ? void 0 : _nextProps$ogMetadata.ogLayoutOrder) || 'og-first') && ((_prevProps$ogMetadata2 = prevProps.ogMetadataProps) === null || _prevProps$ogMetadata2 === void 0 ? void 0 : _prevProps$ogMetadata2.ogShowUrl) === ((_nextProps$ogMetadata2 = nextProps.ogMetadataProps) === null || _nextProps$ogMetadata2 === void 0 ? void 0 : _nextProps$ogMetadata2.ogShowUrl) && ((_prevProps$ogMetadata3 = prevProps.ogMetadataProps) === null || _prevProps$ogMetadata3 === void 0 ? void 0 : _prevProps$ogMetadata3.ogShowTitle) === ((_nextProps$ogMetadata3 = nextProps.ogMetadataProps) === null || _nextProps$ogMetadata3 === void 0 ? void 0 : _nextProps$ogMetadata3.ogShowTitle) && ((_prevProps$ogMetadata4 = prevProps.ogMetadataProps) === null || _prevProps$ogMetadata4 === void 0 ? void 0 : _prevProps$ogMetadata4.ogShowDescription) === ((_nextProps$ogMetadata4 = nextProps.ogMetadataProps) === null || _nextProps$ogMetadata4 === void 0 ? void 0 : _nextProps$ogMetadata4.ogShowDescription) && ((_prevProps$ogMetadata5 = prevProps.ogMetadataProps) === null || _prevProps$ogMetadata5 === void 0 ? void 0 : _prevProps$ogMetadata5.ogShowFavicon) === ((_nextProps$ogMetadata5 = nextProps.ogMetadataProps) === null || _nextProps$ogMetadata5 === void 0 ? void 0 : _nextProps$ogMetadata5.ogShowFavicon) && ((_prevProps$ogMetadata6 = prevProps.ogMetadataProps) === null || _prevProps$ogMetadata6 === void 0 ? void 0 : _prevProps$ogMetadata6.order) === ((_nextProps$ogMetadata6 = nextProps.ogMetadataProps) === null || _nextProps$ogMetadata6 === void 0 ? void 0 : _nextProps$ogMetadata6.order));
|
|
33092
33235
|
});
|
|
33093
|
-
var ForwardedTitle = styled__default.h3(_templateObject$D || (_templateObject$D = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n font-weight: 500;\n font-size: 13px;\n line-height: 16px;\n color: ", ";\n //margin: ", ";\n margin: 0;\n padding: ", ";\n padding-top: ", ";\n padding-bottom: ", ";\n\n & > svg {\n margin-right: 4px;\n width: 16px;\n height: 16px;\n color: ", ";\n }\n"])), function (props) {
|
|
33236
|
+
var ForwardedTitle = styled__default.h3(_templateObject$D || (_templateObject$D = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n font-weight: 500;\n font-size: 13px;\n line-height: 16px;\n color: ", ";\n // margin: ", ";\n margin: 0;\n padding: ", ";\n padding-top: ", ";\n padding-bottom: ", ";\n\n & > svg {\n margin-right: 4px;\n width: 16px;\n height: 16px;\n color: ", ";\n }\n"])), function (props) {
|
|
33094
33237
|
return props.color;
|
|
33095
33238
|
}, function (props) {
|
|
33096
33239
|
return props.withAttachments && props.withBody ? '0' : '0 0 4px';
|
|
@@ -33142,7 +33285,7 @@ var FrequentlyEmojisContainer = styled__default.div(_templateObject5$j || (_temp
|
|
|
33142
33285
|
return props.rtlDirection && '0';
|
|
33143
33286
|
});
|
|
33144
33287
|
|
|
33145
|
-
var _templateObject$E, _templateObject2$z, _templateObject3$t, _templateObject4$p, _templateObject5$k, _templateObject6$h, _templateObject7$f, _templateObject8$e, _templateObject9$
|
|
33288
|
+
var _templateObject$E, _templateObject2$z, _templateObject3$t, _templateObject4$p, _templateObject5$k, _templateObject6$h, _templateObject7$f, _templateObject8$e, _templateObject9$c, _templateObject0$b, _templateObject1$8;
|
|
33146
33289
|
var defaultFormatDate = function defaultFormatDate(date) {
|
|
33147
33290
|
var m = moment(date);
|
|
33148
33291
|
if (m.isSame(moment(), 'day')) {
|
|
@@ -33538,7 +33681,7 @@ var RowDate = styled__default.div(_templateObject7$f || (_templateObject7$f = _t
|
|
|
33538
33681
|
var Empty = styled__default.div(_templateObject8$e || (_templateObject8$e = _taggedTemplateLiteralLoose(["\n color: ", ";\n text-align: center;\n padding: 16px 0;\n font-size: 14px;\n height: calc(100% - 32px);\n display: flex;\n align-items: center;\n justify-content: center;\n overflow: hidden;\n"])), function (p) {
|
|
33539
33682
|
return p.color;
|
|
33540
33683
|
});
|
|
33541
|
-
var DropdownRoot = styled__default.div(_templateObject9$
|
|
33684
|
+
var DropdownRoot = styled__default.div(_templateObject9$c || (_templateObject9$c = _taggedTemplateLiteralLoose(["\n position: absolute;\n top: ", ";\n bottom: ", ";\n ", "\n z-index: 15;\n background: ", ";\n box-shadow: 0px 0px 24px 0px #11153929;\n border-radius: 16px;\n direction: initial;\n visibility: ", ";\n"])), function (p) {
|
|
33542
33685
|
return p.flip ? 'auto' : 'calc(100% + 8px)';
|
|
33543
33686
|
}, function (p) {
|
|
33544
33687
|
return p.flip ? 'calc(100% + 8px)' : 'auto';
|
|
@@ -33550,7 +33693,7 @@ var DropdownRoot = styled__default.div(_templateObject9$b || (_templateObject9$b
|
|
|
33550
33693
|
}, function (p) {
|
|
33551
33694
|
return p.ready ? 'visible' : 'hidden';
|
|
33552
33695
|
});
|
|
33553
|
-
var Panel = styled__default.div(_templateObject0$
|
|
33696
|
+
var Panel = styled__default.div(_templateObject0$b || (_templateObject0$b = _taggedTemplateLiteralLoose(["\n background: ", ";\n border-radius: 16px;\n overflow: hidden;\n transition: height 0.25s ease;\n height: ", ";\n width: ", ";\n min-width: ", ";\n display: flex;\n flex-direction: column;\n"])), function (p) {
|
|
33554
33697
|
return p.bg;
|
|
33555
33698
|
}, function (p) {
|
|
33556
33699
|
return p.open ? Math.min(p.heightPx || 0, parseInt(String(p.maxHeight || '300'), 10) || 300) + "px" : '0';
|
|
@@ -33559,9 +33702,9 @@ var Panel = styled__default.div(_templateObject0$a || (_templateObject0$a = _tag
|
|
|
33559
33702
|
}, function (p) {
|
|
33560
33703
|
return p.minWidth || '340px';
|
|
33561
33704
|
});
|
|
33562
|
-
var Content = styled__default.div(_templateObject1$
|
|
33705
|
+
var Content = styled__default.div(_templateObject1$8 || (_templateObject1$8 = _taggedTemplateLiteralLoose(["\n padding: 16px 12px;\n height: 100%;\n box-sizing: border-box;\n display: flex;\n flex-direction: column;\n"])));
|
|
33563
33706
|
|
|
33564
|
-
var _templateObject$F, _templateObject2$A, _templateObject3$u, _templateObject4$q, _templateObject5$l, _templateObject6$i, _templateObject7$g, _templateObject8$f, _templateObject9$
|
|
33707
|
+
var _templateObject$F, _templateObject2$A, _templateObject3$u, _templateObject4$q, _templateObject5$l, _templateObject6$i, _templateObject7$g, _templateObject8$f, _templateObject9$d, _templateObject0$c, _templateObject1$9, _templateObject10$4, _templateObject11$4, _templateObject12$3;
|
|
33565
33708
|
var Message$1 = function Message(_ref) {
|
|
33566
33709
|
var message = _ref.message,
|
|
33567
33710
|
channel = _ref.channel,
|
|
@@ -33715,6 +33858,23 @@ var Message$1 = function Message(_ref) {
|
|
|
33715
33858
|
messageTextLineHeight = _ref.messageTextLineHeight,
|
|
33716
33859
|
messageTimeColorOnAttachment = _ref.messageTimeColorOnAttachment,
|
|
33717
33860
|
shouldOpenUserProfileForMention = _ref.shouldOpenUserProfileForMention,
|
|
33861
|
+
_ref$ogMetadataProps = _ref.ogMetadataProps,
|
|
33862
|
+
ogMetadataProps = _ref$ogMetadataProps === void 0 ? {
|
|
33863
|
+
maxWidth: 400,
|
|
33864
|
+
maxHeight: undefined,
|
|
33865
|
+
ogLayoutOrder: 'link-first',
|
|
33866
|
+
ogShowUrl: false,
|
|
33867
|
+
ogShowTitle: true,
|
|
33868
|
+
ogShowDescription: true,
|
|
33869
|
+
ogShowFavicon: true,
|
|
33870
|
+
order: {
|
|
33871
|
+
image: 1,
|
|
33872
|
+
title: 2,
|
|
33873
|
+
description: 3,
|
|
33874
|
+
link: 4
|
|
33875
|
+
},
|
|
33876
|
+
infoPadding: '0 8px'
|
|
33877
|
+
} : _ref$ogMetadataProps,
|
|
33718
33878
|
_ref$showInfoMessageP = _ref.showInfoMessageProps,
|
|
33719
33879
|
showInfoMessageProps = _ref$showInfoMessageP === void 0 ? {} : _ref$showInfoMessageP;
|
|
33720
33880
|
var _useColor = useColors(),
|
|
@@ -34217,6 +34377,7 @@ var Message$1 = function Message(_ref) {
|
|
|
34217
34377
|
messageTimeColorOnAttachment: messageTimeColorOnAttachment || textOnPrimary,
|
|
34218
34378
|
handleOpenUserProfile: handleOpenUserProfile,
|
|
34219
34379
|
shouldOpenUserProfileForMention: shouldOpenUserProfileForMention,
|
|
34380
|
+
ogMetadataProps: ogMetadataProps,
|
|
34220
34381
|
unsupportedMessage: unsupportedMessage
|
|
34221
34382
|
})), messageStatusAndTimePosition === 'bottomOfMessage' && (messageStatusVisible || messageTimeVisible) && (/*#__PURE__*/React__default.createElement(MessageStatusAndTime$1, {
|
|
34222
34383
|
message: message,
|
|
@@ -34359,7 +34520,7 @@ var EmptySelection = styled__default.span(_templateObject8$f || (_templateObject
|
|
|
34359
34520
|
}, function (props) {
|
|
34360
34521
|
return props.disabled && '0.5';
|
|
34361
34522
|
});
|
|
34362
|
-
var ReactionsContainer = styled__default.div(_templateObject9$
|
|
34523
|
+
var ReactionsContainer = styled__default.div(_templateObject9$d || (_templateObject9$d = _taggedTemplateLiteralLoose(["\n display: inline-flex;\n margin-left: ", ";\n margin-right: ", ";\n\n margin-top: 4px;\n justify-content: flex-end;\n border: ", ";\n box-shadow: ", ";\n filter: drop-shadow(0px 0px 2px rgba(17, 21, 57, 0.08));\n border-radius: ", ";\n background-color: ", ";\n padding: ", ";\n z-index: 9;\n ", ";\n overflow: hidden;\n height: ", ";\n transition: all 0.3s;\n"])), function (props) {
|
|
34363
34524
|
return props.rtlDirection && 'auto';
|
|
34364
34525
|
}, function (props) {
|
|
34365
34526
|
return !props.rtlDirection && 'auto';
|
|
@@ -34378,10 +34539,10 @@ var ReactionsContainer = styled__default.div(_templateObject9$c || (_templateObj
|
|
|
34378
34539
|
}, function (props) {
|
|
34379
34540
|
return props.isReacted ? '16px' : '0';
|
|
34380
34541
|
});
|
|
34381
|
-
var MessageReactionsCont = styled__default.div(_templateObject0$
|
|
34542
|
+
var MessageReactionsCont = styled__default.div(_templateObject0$c || (_templateObject0$c = _taggedTemplateLiteralLoose(["\n position: relative;\n display: inline-flex;\n max-width: 300px;\n direction: ", ";\n cursor: pointer;\n"])), function (props) {
|
|
34382
34543
|
return props.rtlDirection && 'ltr';
|
|
34383
34544
|
});
|
|
34384
|
-
var MessageStatus$1 = styled__default.span(_templateObject1$
|
|
34545
|
+
var MessageStatus$1 = styled__default.span(_templateObject1$9 || (_templateObject1$9 = _taggedTemplateLiteralLoose(["\n display: inline-flex;\n align-items: center;\n margin-left: 4px;\n text-align: right;\n height: ", ";\n & > svg {\n height: 16px;\n width: 16px;\n }\n"])), function (props) {
|
|
34385
34546
|
return props.height || '14px';
|
|
34386
34547
|
});
|
|
34387
34548
|
var HiddenMessageTime$1 = styled__default.span(_templateObject10$4 || (_templateObject10$4 = _taggedTemplateLiteralLoose(["\n display: ", ";\n font-weight: 400;\n font-size: ", ";\n color: ", ";\n"])), function (props) {
|
|
@@ -34420,7 +34581,7 @@ var MessageItem = styled__default.div(_templateObject12$3 || (_templateObject12$
|
|
|
34420
34581
|
return props.hoverBackground || '';
|
|
34421
34582
|
}, HiddenMessageTime$1, MessageStatus$1);
|
|
34422
34583
|
|
|
34423
|
-
var _templateObject$G, _templateObject2$B, _templateObject3$v, _templateObject4$r, _templateObject5$m, _templateObject6$j, _templateObject7$h, _templateObject8$g, _templateObject9$
|
|
34584
|
+
var _templateObject$G, _templateObject2$B, _templateObject3$v, _templateObject4$r, _templateObject5$m, _templateObject6$j, _templateObject7$h, _templateObject8$g, _templateObject9$e, _templateObject0$d, _templateObject1$a;
|
|
34424
34585
|
var CreateMessageDateDivider = function CreateMessageDateDivider(_ref) {
|
|
34425
34586
|
var lastIndex = _ref.lastIndex,
|
|
34426
34587
|
currentMessageDate = _ref.currentMessageDate,
|
|
@@ -34607,7 +34768,24 @@ var MessageList = function MessageList(_ref2) {
|
|
|
34607
34768
|
hiddenMessagesProperties = _ref2.hiddenMessagesProperties,
|
|
34608
34769
|
shouldOpenUserProfileForMention = _ref2.shouldOpenUserProfileForMention,
|
|
34609
34770
|
_ref2$showInfoMessage = _ref2.showInfoMessageProps,
|
|
34610
|
-
showInfoMessageProps = _ref2$showInfoMessage === void 0 ? {} : _ref2$showInfoMessage
|
|
34771
|
+
showInfoMessageProps = _ref2$showInfoMessage === void 0 ? {} : _ref2$showInfoMessage,
|
|
34772
|
+
_ref2$ogMetadataProps = _ref2.ogMetadataProps,
|
|
34773
|
+
ogMetadataProps = _ref2$ogMetadataProps === void 0 ? {
|
|
34774
|
+
maxWidth: 400,
|
|
34775
|
+
maxHeight: undefined,
|
|
34776
|
+
ogLayoutOrder: 'link-first',
|
|
34777
|
+
ogShowUrl: false,
|
|
34778
|
+
ogShowTitle: true,
|
|
34779
|
+
ogShowDescription: true,
|
|
34780
|
+
ogShowFavicon: true,
|
|
34781
|
+
order: {
|
|
34782
|
+
image: 1,
|
|
34783
|
+
title: 2,
|
|
34784
|
+
description: 3,
|
|
34785
|
+
link: 4
|
|
34786
|
+
},
|
|
34787
|
+
infoPadding: '0 8px'
|
|
34788
|
+
} : _ref2$ogMetadataProps;
|
|
34611
34789
|
var _useColor = useColors(),
|
|
34612
34790
|
outgoingMessageBackground = _useColor[THEME_COLORS.OUTGOING_MESSAGE_BACKGROUND],
|
|
34613
34791
|
themeBackgroundColor = _useColor[THEME_COLORS.BACKGROUND],
|
|
@@ -35438,7 +35616,8 @@ var MessageList = function MessageList(_ref2) {
|
|
|
35438
35616
|
messageTimeColor: messageTimeColor,
|
|
35439
35617
|
messageStatusAndTimeLineHeight: messageStatusAndTimeLineHeight,
|
|
35440
35618
|
shouldOpenUserProfileForMention: shouldOpenUserProfileForMention,
|
|
35441
|
-
showInfoMessageProps: showInfoMessageProps
|
|
35619
|
+
showInfoMessageProps: showInfoMessageProps,
|
|
35620
|
+
ogMetadataProps: ogMetadataProps
|
|
35442
35621
|
}))), isUnreadMessage ? (/*#__PURE__*/React__default.createElement(MessageDivider, {
|
|
35443
35622
|
theme: theme,
|
|
35444
35623
|
newMessagesSeparatorTextColor: newMessagesSeparatorTextColor,
|
|
@@ -35522,13 +35701,13 @@ var DropAttachmentArea = styled__default.div(_templateObject7$h || (_templateObj
|
|
|
35522
35701
|
var MessageWrapper = styled__default.div(_templateObject8$g || (_templateObject8$g = _taggedTemplateLiteralLoose(["\n &.highlight {\n & .message_item {\n transition: all 0.2s ease-in-out;\n padding-top: 4px;\n padding-bottom: 4px;\n background-color: ", ";\n }\n }\n\n & .message_item {\n transition: all 0.2s ease-in-out;\n }\n"])), function (props) {
|
|
35523
35702
|
return props.highlightBg || '#d5d5d5';
|
|
35524
35703
|
});
|
|
35525
|
-
var NoMessagesContainer = styled__default.div(_templateObject9$
|
|
35704
|
+
var NoMessagesContainer = styled__default.div(_templateObject9$e || (_templateObject9$e = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n justify-content: center;\n flex-direction: column;\n height: 100%;\n width: 100%;\n font-weight: 400;\n font-size: 15px;\n line-height: 18px;\n letter-spacing: -0.2px;\n color: ", ";\n"])), function (props) {
|
|
35526
35705
|
return props.color;
|
|
35527
35706
|
});
|
|
35528
|
-
var NoMessagesTitle = styled__default.h4(_templateObject0$
|
|
35707
|
+
var NoMessagesTitle = styled__default.h4(_templateObject0$d || (_templateObject0$d = _taggedTemplateLiteralLoose(["\n margin: 12px 0 8px;\n font-family: Inter, sans-serif;\n text-align: center;\n font-size: 20px;\n font-style: normal;\n font-weight: 500;\n line-height: 24px;\n color: ", ";\n"])), function (props) {
|
|
35529
35708
|
return props.color;
|
|
35530
35709
|
});
|
|
35531
|
-
var NoMessagesText = styled__default.p(_templateObject1$
|
|
35710
|
+
var NoMessagesText = styled__default.p(_templateObject1$a || (_templateObject1$a = _taggedTemplateLiteralLoose(["\n margin: 0;\n text-align: center;\n font-feature-settings:\n 'clig' off,\n 'liga' off;\n font-family: Inter, sans-serif;\n font-size: 15px;\n font-style: normal;\n font-weight: 400;\n line-height: 20px;\n color: ", ";\n"])), function (props) {
|
|
35532
35711
|
return props.color;
|
|
35533
35712
|
});
|
|
35534
35713
|
|
|
@@ -35679,7 +35858,24 @@ var MessagesContainer = function MessagesContainer(_ref) {
|
|
|
35679
35858
|
hiddenMessagesProperties = _ref$hiddenMessagesPr === void 0 ? [] : _ref$hiddenMessagesPr,
|
|
35680
35859
|
shouldOpenUserProfileForMention = _ref.shouldOpenUserProfileForMention,
|
|
35681
35860
|
_ref$showInfoMessageP = _ref.showInfoMessageProps,
|
|
35682
|
-
showInfoMessageProps = _ref$showInfoMessageP === void 0 ? {} : _ref$showInfoMessageP
|
|
35861
|
+
showInfoMessageProps = _ref$showInfoMessageP === void 0 ? {} : _ref$showInfoMessageP,
|
|
35862
|
+
_ref$ogMetadataProps = _ref.ogMetadataProps,
|
|
35863
|
+
ogMetadataProps = _ref$ogMetadataProps === void 0 ? {
|
|
35864
|
+
maxWidth: 400,
|
|
35865
|
+
maxHeight: undefined,
|
|
35866
|
+
ogLayoutOrder: 'link-first',
|
|
35867
|
+
ogShowUrl: false,
|
|
35868
|
+
ogShowTitle: true,
|
|
35869
|
+
ogShowDescription: true,
|
|
35870
|
+
ogShowFavicon: true,
|
|
35871
|
+
order: {
|
|
35872
|
+
image: 1,
|
|
35873
|
+
title: 2,
|
|
35874
|
+
description: 3,
|
|
35875
|
+
link: 4
|
|
35876
|
+
},
|
|
35877
|
+
infoPadding: '0 8px'
|
|
35878
|
+
} : _ref$ogMetadataProps;
|
|
35683
35879
|
return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(MessageList, {
|
|
35684
35880
|
fontFamily: fontFamily,
|
|
35685
35881
|
ownMessageOnRightSide: ownMessageOnRightSide,
|
|
@@ -35810,7 +36006,8 @@ var MessagesContainer = function MessagesContainer(_ref) {
|
|
|
35810
36006
|
messageStatusAndTimeLineHeight: messageStatusAndTimeLineHeight,
|
|
35811
36007
|
hiddenMessagesProperties: hiddenMessagesProperties,
|
|
35812
36008
|
shouldOpenUserProfileForMention: shouldOpenUserProfileForMention,
|
|
35813
|
-
showInfoMessageProps: showInfoMessageProps
|
|
36009
|
+
showInfoMessageProps: showInfoMessageProps,
|
|
36010
|
+
ogMetadataProps: ogMetadataProps
|
|
35814
36011
|
}));
|
|
35815
36012
|
};
|
|
35816
36013
|
|
|
@@ -38140,7 +38337,7 @@ var RecordingAnimation = function RecordingAnimation(_ref2) {
|
|
|
38140
38337
|
}));
|
|
38141
38338
|
};
|
|
38142
38339
|
|
|
38143
|
-
var _templateObject$M, _templateObject2$H, _templateObject3$A, _templateObject4$v, _templateObject5$q, _templateObject6$m, _templateObject7$k, _templateObject8$i, _templateObject9$
|
|
38340
|
+
var _templateObject$M, _templateObject2$H, _templateObject3$A, _templateObject4$v, _templateObject5$q, _templateObject6$m, _templateObject7$k, _templateObject8$i, _templateObject9$f, _templateObject0$e, _templateObject1$b, _templateObject10$5, _templateObject11$5, _templateObject12$4, _templateObject13$3, _templateObject14$2, _templateObject15$2, _templateObject16$2, _templateObject17$2, _templateObject18$2, _templateObject19$2, _templateObject20$2, _templateObject21$1, _templateObject22$1, _templateObject23$1, _templateObject24$1, _templateObject25$1, _templateObject26$1, _templateObject27$1, _templateObject28$1, _templateObject29$1, _templateObject30$1, _templateObject31$1, _templateObject32$1, _templateObject33$1, _templateObject34$1;
|
|
38144
38341
|
function AutoFocusPlugin(_ref) {
|
|
38145
38342
|
var messageForReply = _ref.messageForReply;
|
|
38146
38343
|
var _useLexicalComposerCo = LexicalComposerContext.useLexicalComposerContext(),
|
|
@@ -39308,6 +39505,7 @@ var SendMessageInput = function SendMessageInput(_ref3) {
|
|
|
39308
39505
|
if (connectionStatus === CONNECTION_STATUS.CONNECTED) {
|
|
39309
39506
|
var pendingMessagesMap = getPendingMessagesMap();
|
|
39310
39507
|
var pendingMessagesMapCopy = JSON.parse(JSON.stringify(pendingMessagesMap));
|
|
39508
|
+
clearPendingMessagesMap();
|
|
39311
39509
|
setTimeout(function () {
|
|
39312
39510
|
Object.keys(pendingMessagesMapCopy).forEach(function (key) {
|
|
39313
39511
|
pendingMessagesMapCopy[key].forEach(function (msg) {
|
|
@@ -39771,10 +39969,10 @@ var CloseEditMode = styled__default.span(_templateObject6$m || (_templateObject6
|
|
|
39771
39969
|
});
|
|
39772
39970
|
var UserName$1 = styled__default.span(_templateObject7$k || (_templateObject7$k = _taggedTemplateLiteralLoose(["\n font-weight: 500;\n margin-left: 4px;\n"])));
|
|
39773
39971
|
var ReplyMessageBody$1 = styled__default.div(_templateObject8$i || (_templateObject8$i = _taggedTemplateLiteralLoose(["\n word-break: break-word;\n display: -webkit-box;\n -webkit-line-clamp: 3;\n -webkit-box-orient: vertical;\n overflow: hidden;\n text-overflow: ellipsis;\n"])));
|
|
39774
|
-
var EditReplyMessageHeader = styled__default.h4(_templateObject9$
|
|
39972
|
+
var EditReplyMessageHeader = styled__default.h4(_templateObject9$f || (_templateObject9$f = _taggedTemplateLiteralLoose(["\n display: flex;\n margin: 0 0 2px;\n font-weight: 400;\n font-size: 13px;\n line-height: 16px;\n color: ", ";\n\n > svg {\n margin-right: 4px;\n width: 16px;\n height: 16px;\n }\n"])), function (props) {
|
|
39775
39973
|
return props.color;
|
|
39776
39974
|
});
|
|
39777
|
-
var AddAttachmentIcon = styled__default.span(_templateObject0$
|
|
39975
|
+
var AddAttachmentIcon = styled__default.span(_templateObject0$e || (_templateObject0$e = _taggedTemplateLiteralLoose(["\n display: flex;\n height: ", ";\n align-items: center;\n margin: 0 8px;\n cursor: pointer;\n line-height: 13px;\n z-index: 2;\n order: ", ";\n\n > svg {\n ", ";\n width: 24px;\n }\n\n &:hover > svg {\n color: ", ";\n }\n"])), function (props) {
|
|
39778
39976
|
return props.height ? props.height + "px" : '36px';
|
|
39779
39977
|
}, function (props) {
|
|
39780
39978
|
return props.order === 0 || props.order ? props.order : 1;
|
|
@@ -39783,7 +39981,7 @@ var AddAttachmentIcon = styled__default.span(_templateObject0$d || (_templateObj
|
|
|
39783
39981
|
}, function (props) {
|
|
39784
39982
|
return props.hoverColor;
|
|
39785
39983
|
});
|
|
39786
|
-
var SendMessageInputContainer = styled__default.div(_templateObject1$
|
|
39984
|
+
var SendMessageInputContainer = styled__default.div(_templateObject1$b || (_templateObject1$b = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: flex-end;\n justify-content: space-between;\n position: relative;\n min-height: ", ";\n box-sizing: border-box;\n border-radius: ", ";\n\n & .dropdown-trigger.open {\n color: #ccc;\n\n & ", " {\n & > svg {\n color: ", ";\n }\n ;\n }\n }\n}\n"])), function (props) {
|
|
39787
39985
|
return props.minHeight || '36px';
|
|
39788
39986
|
}, function (props) {
|
|
39789
39987
|
return props.messageForReply ? '0 0 4px 4px' : '4px';
|
|
@@ -40114,7 +40312,7 @@ function SvgUnpin(props) {
|
|
|
40114
40312
|
})));
|
|
40115
40313
|
}
|
|
40116
40314
|
|
|
40117
|
-
var _templateObject$N, _templateObject2$I, _templateObject3$B, _templateObject4$w, _templateObject5$r, _templateObject6$n, _templateObject7$l, _templateObject8$j, _templateObject9$
|
|
40315
|
+
var _templateObject$N, _templateObject2$I, _templateObject3$B, _templateObject4$w, _templateObject5$r, _templateObject6$n, _templateObject7$l, _templateObject8$j, _templateObject9$g, _templateObject0$f, _templateObject1$c, _templateObject10$6, _templateObject11$6, _templateObject12$5, _templateObject13$4, _templateObject14$3, _templateObject15$3, _templateObject16$3;
|
|
40118
40316
|
var Actions = function Actions(_ref) {
|
|
40119
40317
|
var setActionsHeight = _ref.setActionsHeight,
|
|
40120
40318
|
channel = _ref.channel,
|
|
@@ -40590,9 +40788,9 @@ var DefaultMutedIcon = styled__default(SvgUnmuteNotifications)(_templateObject5$
|
|
|
40590
40788
|
var DefaultMuteIcon = styled__default(SvgNotifications)(_templateObject6$n || (_templateObject6$n = _taggedTemplateLiteralLoose([""])));
|
|
40591
40789
|
var DefaultStarIcon = styled__default(SvgStar)(_templateObject7$l || (_templateObject7$l = _taggedTemplateLiteralLoose([""])));
|
|
40592
40790
|
var DefaultUnpinIcon = styled__default(SvgUnpin)(_templateObject8$j || (_templateObject8$j = _taggedTemplateLiteralLoose([""])));
|
|
40593
|
-
var DefaultPinIcon = styled__default(SvgPin)(_templateObject9$
|
|
40594
|
-
var DefaultMarkAsRead = styled__default(SvgMarkAsRead)(_templateObject0$
|
|
40595
|
-
var DefaultMarkAsUnRead = styled__default(SvgMarkAsUnRead)(_templateObject1$
|
|
40791
|
+
var DefaultPinIcon = styled__default(SvgPin)(_templateObject9$g || (_templateObject9$g = _taggedTemplateLiteralLoose([""])));
|
|
40792
|
+
var DefaultMarkAsRead = styled__default(SvgMarkAsRead)(_templateObject0$f || (_templateObject0$f = _taggedTemplateLiteralLoose([""])));
|
|
40793
|
+
var DefaultMarkAsUnRead = styled__default(SvgMarkAsUnRead)(_templateObject1$c || (_templateObject1$c = _taggedTemplateLiteralLoose([""])));
|
|
40596
40794
|
var DefaultBlockIcon = styled__default(SvgBlockChannel)(_templateObject10$6 || (_templateObject10$6 = _taggedTemplateLiteralLoose([""])));
|
|
40597
40795
|
var DefaultReportIcon = styled__default(SvgReport)(_templateObject11$6 || (_templateObject11$6 = _taggedTemplateLiteralLoose([""])));
|
|
40598
40796
|
var DefaultClearIcon = styled__default(SvgClear)(_templateObject12$5 || (_templateObject12$5 = _taggedTemplateLiteralLoose([""])));
|
|
@@ -40814,7 +41012,7 @@ function ResetLinkConfirmModal(_ref) {
|
|
|
40814
41012
|
});
|
|
40815
41013
|
}
|
|
40816
41014
|
|
|
40817
|
-
var _templateObject$P, _templateObject2$K, _templateObject3$D, _templateObject4$x, _templateObject5$s, _templateObject6$o, _templateObject7$m, _templateObject8$k, _templateObject9$
|
|
41015
|
+
var _templateObject$P, _templateObject2$K, _templateObject3$D, _templateObject4$x, _templateObject5$s, _templateObject6$o, _templateObject7$m, _templateObject8$k, _templateObject9$h, _templateObject0$g, _templateObject1$d, _templateObject10$7, _templateObject11$7, _templateObject12$6, _templateObject13$5;
|
|
40818
41016
|
function InviteLinkModal(_ref) {
|
|
40819
41017
|
var _getInviteLinkOptions, _tabs$link, _tabs$qr, _tabs$link2, _tabs$qr2;
|
|
40820
41018
|
var onClose = _ref.onClose,
|
|
@@ -41314,11 +41512,11 @@ var LinkInput = styled__default.input(_templateObject7$m || (_templateObject7$m
|
|
|
41314
41512
|
return p.color;
|
|
41315
41513
|
});
|
|
41316
41514
|
var CopyButton = styled__default.button(_templateObject8$k || (_templateObject8$k = _taggedTemplateLiteralLoose(["\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: 40px;\n height: 40px;\n border: none;\n background: transparent;\n cursor: pointer;\n"])));
|
|
41317
|
-
var CopyButtonWrapper = styled__default.div(_templateObject9$
|
|
41318
|
-
var SectionTitle = styled__default.h4(_templateObject0$
|
|
41515
|
+
var CopyButtonWrapper = styled__default.div(_templateObject9$h || (_templateObject9$h = _taggedTemplateLiteralLoose(["\n position: relative;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n"])));
|
|
41516
|
+
var SectionTitle = styled__default.h4(_templateObject0$g || (_templateObject0$g = _taggedTemplateLiteralLoose(["\n margin: 16px 0 8px;\n font-weight: 500;\n font-size: 15px;\n line-height: 16px;\n color: ", ";\n"])), function (p) {
|
|
41319
41517
|
return p.color;
|
|
41320
41518
|
});
|
|
41321
|
-
var HistoryRow = styled__default.div(_templateObject1$
|
|
41519
|
+
var HistoryRow = styled__default.div(_templateObject1$d || (_templateObject1$d = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n justify-content: space-between;\n margin-bottom: 12px;\n"])));
|
|
41322
41520
|
var Switch = styled__default.div(_templateObject10$7 || (_templateObject10$7 = _taggedTemplateLiteralLoose(["\n width: 44px;\n height: 26px;\n border-radius: 13px;\n background: ", ";\n position: relative;\n cursor: pointer;\n transition: background 0.2s ease;\n\n &:after {\n content: '';\n position: absolute;\n top: 3px;\n left: ", ";\n width: 20px;\n height: 20px;\n background: #fff;\n border-radius: 50%;\n transition: left 0.2s ease;\n }\n"])), function (p) {
|
|
41323
41521
|
return p.active ? p.accent : 'rgba(226,226,226,1)';
|
|
41324
41522
|
}, function (p) {
|
|
@@ -41334,7 +41532,7 @@ var QrHint = styled__default.p(_templateObject13$5 || (_templateObject13$5 = _ta
|
|
|
41334
41532
|
return p.color;
|
|
41335
41533
|
});
|
|
41336
41534
|
|
|
41337
|
-
var _templateObject$Q, _templateObject2$L, _templateObject3$E, _templateObject4$y, _templateObject5$t, _templateObject6$p, _templateObject7$n, _templateObject8$l, _templateObject9$
|
|
41535
|
+
var _templateObject$Q, _templateObject2$L, _templateObject3$E, _templateObject4$y, _templateObject5$t, _templateObject6$p, _templateObject7$n, _templateObject8$l, _templateObject9$i;
|
|
41338
41536
|
var Members = function Members(_ref) {
|
|
41339
41537
|
var _members$find;
|
|
41340
41538
|
var channel = _ref.channel,
|
|
@@ -41678,7 +41876,7 @@ var MemberItem$1 = styled__default.li(_templateObject8$l || (_templateObject8$l
|
|
|
41678
41876
|
}, function (props) {
|
|
41679
41877
|
return props.hoverBackground;
|
|
41680
41878
|
}, EditMemberIcon, UserStatus);
|
|
41681
|
-
var RoleBadge = styled__default.span(_templateObject9$
|
|
41879
|
+
var RoleBadge = styled__default.span(_templateObject9$i || (_templateObject9$i = _taggedTemplateLiteralLoose(["\n position: relative;\n padding: 2px 8px;\n border-radius: 12px;\n margin-left: 4px;\n font-weight: 500;\n font-size: 12px;\n line-height: 16px;\n color: ", ";\n\n &::after {\n content: '';\n position: absolute;\n top: 0;\n left: 0;\n border-radius: 12px;\n width: 100%;\n height: 100%;\n background-color: ", ";\n opacity: 0.1;\n }\n"])), function (props) {
|
|
41682
41880
|
return props.color;
|
|
41683
41881
|
}, function (props) {
|
|
41684
41882
|
return props.backgroundColor;
|
|
@@ -42713,7 +42911,7 @@ var EditChannel = function EditChannel(_ref) {
|
|
|
42713
42911
|
})));
|
|
42714
42912
|
};
|
|
42715
42913
|
|
|
42716
|
-
var _templateObject$Z, _templateObject2$S, _templateObject3$J, _templateObject4$D, _templateObject5$x, _templateObject6$s, _templateObject7$q, _templateObject8$o, _templateObject9$
|
|
42914
|
+
var _templateObject$Z, _templateObject2$S, _templateObject3$J, _templateObject4$D, _templateObject5$x, _templateObject6$s, _templateObject7$q, _templateObject8$o, _templateObject9$j, _templateObject0$h, _templateObject1$e, _templateObject10$8, _templateObject11$8;
|
|
42717
42915
|
var Details = function Details(_ref) {
|
|
42718
42916
|
var _activeChannel$member;
|
|
42719
42917
|
var detailsTitleText = _ref.detailsTitleText,
|
|
@@ -43179,17 +43377,17 @@ var ChannelInfo$4 = styled__default.div(_templateObject7$q || (_templateObject7$
|
|
|
43179
43377
|
var DetailsHeader = styled__default.div(_templateObject8$o || (_templateObject8$o = _taggedTemplateLiteralLoose(["\n border-bottom: 6px solid ", ";\n align-items: center;\n box-sizing: border-box;\n padding: 20px 16px;\n"])), function (props) {
|
|
43180
43378
|
return props.borderColor;
|
|
43181
43379
|
});
|
|
43182
|
-
var ChannelAvatarAndName = styled__default.div(_templateObject9$
|
|
43380
|
+
var ChannelAvatarAndName = styled__default.div(_templateObject9$j || (_templateObject9$j = _taggedTemplateLiteralLoose(["\n position: relative;\n display: flex;\n align-items: center;\n box-sizing: border-box;\n flex-direction: ", ";\n"])), function (props) {
|
|
43183
43381
|
return props.direction;
|
|
43184
43382
|
});
|
|
43185
|
-
var ChannelName$1 = styled__default(SectionHeader)(_templateObject0$
|
|
43383
|
+
var ChannelName$1 = styled__default(SectionHeader)(_templateObject0$h || (_templateObject0$h = _taggedTemplateLiteralLoose(["\n white-space: nowrap;\n max-width: ", ";\n text-overflow: ellipsis;\n text-color: ", ";\n overflow: hidden;\n text-transform: ", ";\n"])), function (props) {
|
|
43186
43384
|
return props.isDirect ? '200px' : '168px';
|
|
43187
43385
|
}, function (props) {
|
|
43188
43386
|
return props.color;
|
|
43189
43387
|
}, function (props) {
|
|
43190
43388
|
return props.uppercase && 'uppercase';
|
|
43191
43389
|
});
|
|
43192
|
-
var ChannelNameWrapper = styled__default.div(_templateObject1$
|
|
43390
|
+
var ChannelNameWrapper = styled__default.div(_templateObject1$e || (_templateObject1$e = _taggedTemplateLiteralLoose(["\n display: flex;\n justify-content: center;\n"])));
|
|
43193
43391
|
var EditButton = styled__default.span(_templateObject10$8 || (_templateObject10$8 = _taggedTemplateLiteralLoose(["\n margin-left: 6px;\n cursor: pointer;\n color: #b2b6be;\n"])));
|
|
43194
43392
|
var PhoneNumberContainer = styled__default.span(_templateObject11$8 || (_templateObject11$8 = _taggedTemplateLiteralLoose(["\n position: relative;\n display: inline-flex;\n align-items: center;\n cursor: pointer;\n user-select: text;\n"])));
|
|
43195
43393
|
|