sceyt-chat-react-uikit 1.7.6-beta.14 → 1.7.6-beta.15
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/AudioPlayer/AudioVisualization.d.ts +14 -0
- package/index.js +266 -169
- package/index.modern.js +266 -169
- package/package.json +1 -1
package/index.modern.js
CHANGED
|
@@ -19064,7 +19064,7 @@ function sendMessage(action) {
|
|
|
19064
19064
|
_context2.n = 13;
|
|
19065
19065
|
break;
|
|
19066
19066
|
case 12:
|
|
19067
|
-
throw Error('
|
|
19067
|
+
throw new Error('Connection required to send message');
|
|
19068
19068
|
case 13:
|
|
19069
19069
|
_context2.n = 16;
|
|
19070
19070
|
break;
|
|
@@ -32241,8 +32241,74 @@ class WaveSurfer extends Player {
|
|
|
32241
32241
|
WaveSurfer.BasePlugin = BasePlugin;
|
|
32242
32242
|
WaveSurfer.dom = dom;
|
|
32243
32243
|
|
|
32244
|
-
var _templateObject$v, _templateObject2$r
|
|
32244
|
+
var _templateObject$v, _templateObject2$r;
|
|
32245
|
+
var AudioVisualization = function AudioVisualization(_ref) {
|
|
32246
|
+
var tmb = _ref.tmb,
|
|
32247
|
+
duration = _ref.duration,
|
|
32248
|
+
currentTime = _ref.currentTime,
|
|
32249
|
+
waveColor = _ref.waveColor,
|
|
32250
|
+
progressColor = _ref.progressColor,
|
|
32251
|
+
_ref$height = _ref.height,
|
|
32252
|
+
height = _ref$height === void 0 ? 20 : _ref$height,
|
|
32253
|
+
_ref$barWidth = _ref.barWidth,
|
|
32254
|
+
barWidth = _ref$barWidth === void 0 ? 1 : _ref$barWidth,
|
|
32255
|
+
_ref$barGap = _ref.barGap,
|
|
32256
|
+
barGap = _ref$barGap === void 0 ? 2 : _ref$barGap,
|
|
32257
|
+
_ref$barRadius = _ref.barRadius,
|
|
32258
|
+
barRadius = _ref$barRadius === void 0 ? 1.5 : _ref$barRadius;
|
|
32259
|
+
var normalizedBars = useMemo(function () {
|
|
32260
|
+
if (!tmb || tmb.length === 0) return [];
|
|
32261
|
+
var maxVal = Math.max.apply(Math, tmb);
|
|
32262
|
+
if (maxVal === 0) return [];
|
|
32263
|
+
return tmb.map(function (value) {
|
|
32264
|
+
var normalized = value / maxVal * height;
|
|
32265
|
+
return Math.max(2, normalized);
|
|
32266
|
+
});
|
|
32267
|
+
}, [tmb, height]);
|
|
32268
|
+
var progressPercentage = duration > 0 ? currentTime / duration * 100 : 0;
|
|
32269
|
+
var lastPlayedBarIndex = useMemo(function () {
|
|
32270
|
+
if (progressPercentage === 0) return -1;
|
|
32271
|
+
var barIndex = Math.floor(progressPercentage / 100 * normalizedBars.length);
|
|
32272
|
+
return Math.min(barIndex, normalizedBars.length - 1);
|
|
32273
|
+
}, [progressPercentage, normalizedBars.length]);
|
|
32274
|
+
return /*#__PURE__*/React__default.createElement(Container$e, {
|
|
32275
|
+
height: height
|
|
32276
|
+
}, normalizedBars.map(function (barHeight, index) {
|
|
32277
|
+
var barPosition = index / normalizedBars.length * 100;
|
|
32278
|
+
var isPlayed = barPosition < progressPercentage;
|
|
32279
|
+
var isLastPlayed = index === lastPlayedBarIndex;
|
|
32280
|
+
var finalHeight = isLastPlayed ? Math.min(barHeight * 1.3, height) : barHeight;
|
|
32281
|
+
return /*#__PURE__*/React__default.createElement(Bar, {
|
|
32282
|
+
key: index,
|
|
32283
|
+
height: finalHeight,
|
|
32284
|
+
width: barWidth,
|
|
32285
|
+
gap: barGap,
|
|
32286
|
+
radius: barRadius,
|
|
32287
|
+
color: isPlayed ? progressColor : waveColor,
|
|
32288
|
+
isBold: isLastPlayed
|
|
32289
|
+
});
|
|
32290
|
+
}));
|
|
32291
|
+
};
|
|
32292
|
+
var Container$e = styled.div(_templateObject$v || (_templateObject$v = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n height: ", "px;\n width: 100%;\n gap: 2px;\n"])), function (props) {
|
|
32293
|
+
return props.height;
|
|
32294
|
+
});
|
|
32295
|
+
var Bar = styled.div(_templateObject2$r || (_templateObject2$r = _taggedTemplateLiteralLoose(["\n width: ", "px;\n height: ", "px;\n background-color: ", ";\n border-radius: ", "px;\n min-height: 2px;\n transition:\n background-color 0.1s ease,\n height 0.1s ease,\n opacity 0.1s ease;\n opacity: ", ";\n ", "\n"])), function (props) {
|
|
32296
|
+
return props.width;
|
|
32297
|
+
}, function (props) {
|
|
32298
|
+
return props.height;
|
|
32299
|
+
}, function (props) {
|
|
32300
|
+
return props.color;
|
|
32301
|
+
}, function (props) {
|
|
32302
|
+
return props.radius;
|
|
32303
|
+
}, function (props) {
|
|
32304
|
+
return props.isBold ? 1 : 0.8;
|
|
32305
|
+
}, function (props) {
|
|
32306
|
+
return props.isBold ? "\n box-shadow: 0 0 4px " + props.color + ";\n filter: brightness(1.2);\n " : '';
|
|
32307
|
+
});
|
|
32308
|
+
|
|
32309
|
+
var _templateObject$w, _templateObject2$s, _templateObject3$m, _templateObject4$i, _templateObject5$f, _templateObject6$d, _templateObject7$c;
|
|
32245
32310
|
var AudioPlayer = function AudioPlayer(_ref) {
|
|
32311
|
+
var _file$metadata, _file$metadata2, _file$metadata3;
|
|
32246
32312
|
var url = _ref.url,
|
|
32247
32313
|
file = _ref.file,
|
|
32248
32314
|
messagePlayed = _ref.messagePlayed,
|
|
@@ -32274,9 +32340,15 @@ var AudioPlayer = function AudioPlayer(_ref) {
|
|
|
32274
32340
|
var _useState4 = useState(''),
|
|
32275
32341
|
currentTime = _useState4[0],
|
|
32276
32342
|
setCurrentTime = _useState4[1];
|
|
32277
|
-
var _useState5 = useState(
|
|
32278
|
-
|
|
32279
|
-
|
|
32343
|
+
var _useState5 = useState(0),
|
|
32344
|
+
currentTimeSeconds = _useState5[0],
|
|
32345
|
+
setCurrentTimeSeconds = _useState5[1];
|
|
32346
|
+
var _useState6 = useState(0),
|
|
32347
|
+
duration = _useState6[0],
|
|
32348
|
+
setDuration = _useState6[1];
|
|
32349
|
+
var _useState7 = useState(1),
|
|
32350
|
+
audioRate = _useState7[0],
|
|
32351
|
+
setAudioRate = _useState7[1];
|
|
32280
32352
|
var wavesurfer = useRef(null);
|
|
32281
32353
|
var wavesurferContainer = useRef(null);
|
|
32282
32354
|
var intervalRef = useRef(null);
|
|
@@ -32305,6 +32377,7 @@ var AudioPlayer = function AudioPlayer(_ref) {
|
|
|
32305
32377
|
var currentTime = wavesurfer.current.getCurrentTime();
|
|
32306
32378
|
if (currentTime >= 0) {
|
|
32307
32379
|
setCurrentTime(formatAudioVideoTime(currentTime));
|
|
32380
|
+
setCurrentTimeSeconds(currentTime);
|
|
32308
32381
|
}
|
|
32309
32382
|
}, 10);
|
|
32310
32383
|
} else {
|
|
@@ -32356,6 +32429,7 @@ var AudioPlayer = function AudioPlayer(_ref) {
|
|
|
32356
32429
|
return clearInterval(recordingInterval);
|
|
32357
32430
|
};
|
|
32358
32431
|
}, [recording.initRecording]);
|
|
32432
|
+
console.log('file', file === null || file === void 0 ? void 0 : file.metadata);
|
|
32359
32433
|
useEffect(function () {
|
|
32360
32434
|
if (url) {
|
|
32361
32435
|
if (url !== '_' && !isRendered && wavesurfer && wavesurfer.current) {
|
|
@@ -32366,8 +32440,8 @@ var AudioPlayer = function AudioPlayer(_ref) {
|
|
|
32366
32440
|
try {
|
|
32367
32441
|
wavesurfer.current = WaveSurfer.create({
|
|
32368
32442
|
container: wavesurferContainer.current,
|
|
32369
|
-
waveColor:
|
|
32370
|
-
progressColor:
|
|
32443
|
+
waveColor: 'transparent',
|
|
32444
|
+
progressColor: 'transparent',
|
|
32371
32445
|
audioRate: audioRate,
|
|
32372
32446
|
barWidth: 1,
|
|
32373
32447
|
barHeight: 1,
|
|
@@ -32380,6 +32454,7 @@ var AudioPlayer = function AudioPlayer(_ref) {
|
|
|
32380
32454
|
var peaks;
|
|
32381
32455
|
if (file.metadata) {
|
|
32382
32456
|
if (file.metadata.dur) {
|
|
32457
|
+
setDuration(file.metadata.dur);
|
|
32383
32458
|
setCurrentTime(formatAudioVideoTime(file.metadata.dur));
|
|
32384
32459
|
}
|
|
32385
32460
|
if (file.metadata.tmb) {
|
|
@@ -32395,6 +32470,7 @@ var AudioPlayer = function AudioPlayer(_ref) {
|
|
|
32395
32470
|
wavesurfer.current.load(url, peaks);
|
|
32396
32471
|
wavesurfer.current.on('ready', function () {
|
|
32397
32472
|
var audioDuration = wavesurfer.current.getDuration();
|
|
32473
|
+
setDuration(audioDuration);
|
|
32398
32474
|
setCurrentTime(formatAudioVideoTime(audioDuration));
|
|
32399
32475
|
wavesurfer.current.drawBuffer = function (d) {
|
|
32400
32476
|
log.info('filters --- ', d);
|
|
@@ -32404,7 +32480,9 @@ var AudioPlayer = function AudioPlayer(_ref) {
|
|
|
32404
32480
|
setPlayAudio(false);
|
|
32405
32481
|
wavesurfer.current.seekTo(0);
|
|
32406
32482
|
var audioDuration = wavesurfer.current.getDuration();
|
|
32407
|
-
|
|
32483
|
+
setDuration(audioDuration);
|
|
32484
|
+
setCurrentTime(formatAudioVideoTime(0));
|
|
32485
|
+
setCurrentTimeSeconds(0);
|
|
32408
32486
|
if (playingAudioId === file.id) {
|
|
32409
32487
|
dispatch(setPlayingAudioIdAC(null));
|
|
32410
32488
|
}
|
|
@@ -32420,6 +32498,7 @@ var AudioPlayer = function AudioPlayer(_ref) {
|
|
|
32420
32498
|
wavesurfer.current.on('interaction', function () {
|
|
32421
32499
|
var currentTime = wavesurfer.current.getCurrentTime();
|
|
32422
32500
|
setCurrentTime(formatAudioVideoTime(currentTime));
|
|
32501
|
+
setCurrentTimeSeconds(currentTime);
|
|
32423
32502
|
});
|
|
32424
32503
|
if (url !== '_') {
|
|
32425
32504
|
setIsRendered(true);
|
|
@@ -32444,35 +32523,53 @@ var AudioPlayer = function AudioPlayer(_ref) {
|
|
|
32444
32523
|
wavesurfer.current.pause();
|
|
32445
32524
|
}
|
|
32446
32525
|
}, [playingAudioId]);
|
|
32447
|
-
return /*#__PURE__*/React__default.createElement(Container$
|
|
32526
|
+
return /*#__PURE__*/React__default.createElement(Container$f, null, /*#__PURE__*/React__default.createElement(PlayPause, {
|
|
32448
32527
|
onClick: handlePlayPause,
|
|
32449
32528
|
iconColor: accentColor
|
|
32450
|
-
}, playAudio ? /*#__PURE__*/React__default.createElement(SvgPause, null) : /*#__PURE__*/React__default.createElement(SvgPlay, null)), /*#__PURE__*/React__default.createElement(WaveContainer, null, /*#__PURE__*/React__default.createElement(
|
|
32451
|
-
ref: wavesurferContainer
|
|
32452
|
-
|
|
32529
|
+
}, playAudio ? /*#__PURE__*/React__default.createElement(SvgPause, null) : /*#__PURE__*/React__default.createElement(SvgPlay, null)), /*#__PURE__*/React__default.createElement(WaveContainer, null, /*#__PURE__*/React__default.createElement(VisualizationWrapper, null, /*#__PURE__*/React__default.createElement(AudioVisualizationPlaceholder, {
|
|
32530
|
+
ref: wavesurferContainer,
|
|
32531
|
+
hidden: !!((_file$metadata = file.metadata) !== null && _file$metadata !== void 0 && _file$metadata.tmb && Array.isArray(file.metadata.tmb))
|
|
32532
|
+
}), ((_file$metadata2 = file.metadata) === null || _file$metadata2 === void 0 ? void 0 : _file$metadata2.tmb) && Array.isArray(file.metadata.tmb) && (/*#__PURE__*/React__default.createElement(AudioVisualization, {
|
|
32533
|
+
tmb: file.metadata.tmb,
|
|
32534
|
+
duration: duration || file.metadata.dur || 0,
|
|
32535
|
+
currentTime: currentTimeSeconds,
|
|
32536
|
+
waveColor: textSecondary,
|
|
32537
|
+
progressColor: accentColor,
|
|
32538
|
+
height: 20,
|
|
32539
|
+
barWidth: 1,
|
|
32540
|
+
barGap: 2,
|
|
32541
|
+
barRadius: 1.5
|
|
32542
|
+
}))), /*#__PURE__*/React__default.createElement(AudioRate, {
|
|
32453
32543
|
color: textSecondary,
|
|
32454
32544
|
onClick: handleSetAudioRate,
|
|
32455
32545
|
backgroundColor: backgroundSections
|
|
32456
32546
|
}, audioRate, /*#__PURE__*/React__default.createElement("span", null, "X"))), /*#__PURE__*/React__default.createElement(Timer$1, {
|
|
32457
32547
|
color: textSecondary
|
|
32458
|
-
}, currentTime));
|
|
32548
|
+
}, currentTime || formatAudioVideoTime(((_file$metadata3 = file.metadata) === null || _file$metadata3 === void 0 ? void 0 : _file$metadata3.dur) || 0)));
|
|
32459
32549
|
};
|
|
32460
|
-
var Container$
|
|
32461
|
-
var PlayPause = styled.div(_templateObject2$
|
|
32550
|
+
var Container$f = styled.div(_templateObject$w || (_templateObject$w = _taggedTemplateLiteralLoose(["\n position: relative;\n display: flex;\n align-items: flex-start;\n width: 230px;\n padding: 8px 12px;\n"])));
|
|
32551
|
+
var PlayPause = styled.div(_templateObject2$s || (_templateObject2$s = _taggedTemplateLiteralLoose(["\n cursor: pointer;\n\n & > svg {\n color: ", ";\n display: flex;\n width: 40px;\n height: 40px;\n }\n"])), function (props) {
|
|
32462
32552
|
return props.iconColor;
|
|
32463
32553
|
});
|
|
32464
|
-
var
|
|
32465
|
-
var
|
|
32554
|
+
var VisualizationWrapper = styled.div(_templateObject3$m || (_templateObject3$m = _taggedTemplateLiteralLoose(["\n width: 100%;\n display: flex;\n align-items: center;\n position: relative;\n"])));
|
|
32555
|
+
var AudioVisualizationPlaceholder = styled.div(_templateObject4$i || (_templateObject4$i = _taggedTemplateLiteralLoose(["\n width: 100%;\n position: ", ";\n opacity: ", ";\n pointer-events: ", ";\n"])), function (props) {
|
|
32556
|
+
return props.hidden ? 'absolute' : 'relative';
|
|
32557
|
+
}, function (props) {
|
|
32558
|
+
return props.hidden ? 0 : 1;
|
|
32559
|
+
}, function (props) {
|
|
32560
|
+
return props.hidden ? 'none' : 'auto';
|
|
32561
|
+
});
|
|
32562
|
+
var AudioRate = styled.div(_templateObject5$f || (_templateObject5$f = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n justify-content: center;\n background-color: ", ";\n width: 30px;\n min-width: 30px;\n border-radius: 12px;\n font-weight: 600;\n font-size: 12px;\n line-height: 14px;\n color: ", ";\n height: 18px;\n box-sizing: border-box;\n margin-left: 14px;\n cursor: pointer;\n\n & > span {\n margin-top: auto;\n line-height: 16px;\n font-size: 9px;\n }\n"])), function (props) {
|
|
32466
32563
|
return props.backgroundColor;
|
|
32467
32564
|
}, function (props) {
|
|
32468
32565
|
return props.color;
|
|
32469
32566
|
});
|
|
32470
|
-
var WaveContainer = styled.div(
|
|
32471
|
-
var Timer$1 = styled.div(
|
|
32567
|
+
var WaveContainer = styled.div(_templateObject6$d || (_templateObject6$d = _taggedTemplateLiteralLoose(["\n width: 100%;\n display: flex;\n margin-left: 8px;\n"])));
|
|
32568
|
+
var Timer$1 = styled.div(_templateObject7$c || (_templateObject7$c = _taggedTemplateLiteralLoose(["\n position: absolute;\n left: 59px;\n bottom: 12px;\n display: inline-block;\n font-weight: 400;\n font-size: 11px;\n line-height: 12px;\n color: ", ";\n"])), function (props) {
|
|
32472
32569
|
return props.color;
|
|
32473
32570
|
});
|
|
32474
32571
|
|
|
32475
|
-
var _templateObject$
|
|
32572
|
+
var _templateObject$x, _templateObject2$t, _templateObject3$n, _templateObject4$j, _templateObject5$g, _templateObject6$e, _templateObject7$d, _templateObject8$b, _templateObject9$a, _templateObject0$9, _templateObject1$6, _templateObject10$3, _templateObject11$3;
|
|
32476
32573
|
var Attachment = function Attachment(_ref) {
|
|
32477
32574
|
var attachment = _ref.attachment,
|
|
32478
32575
|
_ref$isPreview = _ref.isPreview,
|
|
@@ -33112,8 +33209,8 @@ var Attachment = function Attachment(_ref) {
|
|
|
33112
33209
|
var Attachment$1 = /*#__PURE__*/React__default.memo(Attachment, function (prevProps, nextProps) {
|
|
33113
33210
|
return prevProps.attachment.url === nextProps.attachment.url && prevProps.handleMediaItemClick === nextProps.handleMediaItemClick && prevProps.attachment.attachmentUrl === nextProps.attachment.attachmentUrl;
|
|
33114
33211
|
});
|
|
33115
|
-
var DownloadImage = styled.div(_templateObject$
|
|
33116
|
-
var AttachmentImgCont = styled.div(_templateObject2$
|
|
33212
|
+
var DownloadImage = styled.div(_templateObject$x || (_templateObject$x = _taggedTemplateLiteralLoose(["\n position: absolute;\n visibility: hidden;\n opacity: 0;\n width: 28px;\n height: 28px;\n top: 12px;\n right: 17px;\n border-radius: 50%;\n line-height: 35px;\n text-align: center;\n cursor: pointer;\n background: #ffffff;\n box-shadow: 0 4px 4px rgba(6, 10, 38, 0.2);\n transition: all 0.1s;\n\n & > svg {\n width: 16px;\n }\n"])));
|
|
33213
|
+
var AttachmentImgCont = styled.div(_templateObject2$t || (_templateObject2$t = _taggedTemplateLiteralLoose(["\n position: relative;\n display: flex;\n align-items: center;\n justify-content: flex-end;\n margin-right: ", ";\n min-width: ", ";\n height: ", ";\n width: ", ";\n max-width: 100%;\n height: ", ";\n max-height: 400px;\n min-height: ", ";\n cursor: pointer;\n\n ", "\n\n &:hover ", " {\n visibility: visible;\n opacity: 1;\n }\n\n ", "\n"])), function (props) {
|
|
33117
33214
|
return props.isPreview ? '16px' : props.isRepliedMessage ? '8px' : '';
|
|
33118
33215
|
}, function (props) {
|
|
33119
33216
|
return !props.isRepliedMessage && !props.fitTheContainer && '165px';
|
|
@@ -33142,7 +33239,7 @@ var ProgressWrapper$1 = styled.span(_templateObject5$g || (_templateObject5$g =
|
|
|
33142
33239
|
var SizeProgress = styled.span(_templateObject6$e || (_templateObject6$e = _taggedTemplateLiteralLoose(["\n position: absolute;\n bottom: -26px;\n background-color: rgba(0, 0, 0, 0.4);\n color: ", ";\n font-size: 12px;\n border-radius: 12px;\n padding: 3px 6px;\n white-space: nowrap;\n"])), function (props) {
|
|
33143
33240
|
return props.color;
|
|
33144
33241
|
});
|
|
33145
|
-
var AttachmentFile$1 = styled.div(_templateObject7$
|
|
33242
|
+
var AttachmentFile$1 = styled.div(_templateObject7$d || (_templateObject7$d = _taggedTemplateLiteralLoose(["\n display: flex;\n position: relative;\n align-items: center;\n padding: ", ";\n //width: ", ";\n min-width: ", ";\n transition: all 0.1s;\n //height: 70px;\n background: ", ";\n border: ", ";\n box-sizing: border-box;\n margin-right: ", ";\n border-radius: ", ";\n\n ", "\n\n & > ", " svg {\n width: 40px;\n height: 40px;\n }\n"])), function (props) {
|
|
33146
33243
|
return !props.isRepliedMessage && '8px 12px;';
|
|
33147
33244
|
}, function (props) {
|
|
33148
33245
|
return !props.isRepliedMessage && (props.width ? props.width + "px" : '350px');
|
|
@@ -33200,7 +33297,7 @@ var VideoCont = styled.div(_templateObject11$3 || (_templateObject11$3 = _tagged
|
|
|
33200
33297
|
return props.isDetailsView && '100%';
|
|
33201
33298
|
});
|
|
33202
33299
|
|
|
33203
|
-
var _templateObject$
|
|
33300
|
+
var _templateObject$y, _templateObject2$u, _templateObject3$o, _templateObject4$k;
|
|
33204
33301
|
var RepliedMessage = function RepliedMessage(_ref) {
|
|
33205
33302
|
var _message$parentMessag;
|
|
33206
33303
|
var message = _ref.message,
|
|
@@ -33307,7 +33404,7 @@ var RepliedMessage = function RepliedMessage(_ref) {
|
|
|
33307
33404
|
var RepliedMessage$1 = /*#__PURE__*/React__default.memo(RepliedMessage, function (prevProps, nextProps) {
|
|
33308
33405
|
return prevProps.theme === nextProps.theme && 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.selectedMessagesMap === nextProps.selectedMessagesMap && prevProps.selectionIsActive === nextProps.selectionIsActive && prevProps.contactsMap === nextProps.contactsMap;
|
|
33309
33406
|
});
|
|
33310
|
-
var ReplyMessageContainer = styled.div(_templateObject$
|
|
33407
|
+
var ReplyMessageContainer = styled.div(_templateObject$y || (_templateObject$y = _taggedTemplateLiteralLoose(["\n display: flex;\n border-left: 2px solid ", ";\n padding: 4px 6px;\n position: relative;\n //margin: ", ";\n margin: ", ";\n background-color: ", ";\n border-radius: 0 4px 4px 0;\n margin-top: ", ";\n cursor: pointer;\n"])), function (props) {
|
|
33311
33408
|
return props.leftBorderColor || '#b8b9c2';
|
|
33312
33409
|
}, function (props) {
|
|
33313
33410
|
return props.withAttachments ? '8px 8px' : '0 0 8px';
|
|
@@ -33318,7 +33415,7 @@ var ReplyMessageContainer = styled.div(_templateObject$x || (_templateObject$x =
|
|
|
33318
33415
|
}, function (props) {
|
|
33319
33416
|
return !props.withSenderName && props.withAttachments && '8px';
|
|
33320
33417
|
});
|
|
33321
|
-
var ReplyMessageBody = styled.div(_templateObject2$
|
|
33418
|
+
var ReplyMessageBody = styled.div(_templateObject2$u || (_templateObject2$u = _taggedTemplateLiteralLoose(["\n margin-top: auto;\n margin-bottom: auto;\n direction: ", ";\n max-width: ", ";\n"])), function (props) {
|
|
33322
33419
|
return props.rtlDirection ? 'initial' : '';
|
|
33323
33420
|
}, function (props) {
|
|
33324
33421
|
return props.maxWidth || '100%';
|
|
@@ -33332,7 +33429,7 @@ var VoiceIconWrapper = styled(SvgVoiceIcon)(_templateObject4$k || (_templateObje
|
|
|
33332
33429
|
return props.color;
|
|
33333
33430
|
});
|
|
33334
33431
|
|
|
33335
|
-
var _templateObject$
|
|
33432
|
+
var _templateObject$z;
|
|
33336
33433
|
var MessageHeader = function MessageHeader(_ref) {
|
|
33337
33434
|
var message = _ref.message,
|
|
33338
33435
|
ownMessageOnRightSide = _ref.ownMessageOnRightSide,
|
|
@@ -33369,7 +33466,7 @@ var MessageHeader = function MessageHeader(_ref) {
|
|
|
33369
33466
|
var MessageHeader$1 = /*#__PURE__*/React__default.memo(MessageHeader, function (prevProps, nextProps) {
|
|
33370
33467
|
return prevProps.message.body === nextProps.message.body && prevProps.message.attachments === nextProps.message.attachments && prevProps.contactsMap === nextProps.contactsMap && prevProps.ownMessageOnRightSide === nextProps.ownMessageOnRightSide && prevProps.outgoingMessageStyles === nextProps.outgoingMessageStyles && prevProps.incomingMessageStyles === nextProps.incomingMessageStyles && prevProps.showMessageSenderName === nextProps.showMessageSenderName && prevProps.getFromContacts === nextProps.getFromContacts;
|
|
33371
33468
|
});
|
|
33372
|
-
var MessageHeaderCont = styled.div(_templateObject$
|
|
33469
|
+
var MessageHeaderCont = styled.div(_templateObject$z || (_templateObject$z = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n padding: ", ";\n"])), function (props) {
|
|
33373
33470
|
return props.withPadding && (props.isForwarded ? '8px 0 2px 12px' : !props.isReplied && !props.messageBody ? props.withMediaAttachment ? '8px 0 8px 12px' : '8px 0 0 12px' : '8px 0 0 12px');
|
|
33374
33471
|
});
|
|
33375
33472
|
|
|
@@ -33812,7 +33909,7 @@ var EMOJIS = [{
|
|
|
33812
33909
|
}]
|
|
33813
33910
|
}];
|
|
33814
33911
|
|
|
33815
|
-
var _templateObject$
|
|
33912
|
+
var _templateObject$A, _templateObject2$v, _templateObject3$p, _templateObject4$l, _templateObject5$h, _templateObject6$f, _templateObject7$e, _templateObject8$c;
|
|
33816
33913
|
var EmojiIcon = function EmojiIcon(_ref) {
|
|
33817
33914
|
var collectionName = _ref.collectionName;
|
|
33818
33915
|
switch (collectionName) {
|
|
@@ -33912,7 +34009,7 @@ function EmojisPopup(_ref2) {
|
|
|
33912
34009
|
}
|
|
33913
34010
|
}, 300);
|
|
33914
34011
|
}, []);
|
|
33915
|
-
return /*#__PURE__*/React__default.createElement(Container$
|
|
34012
|
+
return /*#__PURE__*/React__default.createElement(Container$g, {
|
|
33916
34013
|
backgroundColor: backgroundSections,
|
|
33917
34014
|
borderColor: border,
|
|
33918
34015
|
relativePosition: relativePosition,
|
|
@@ -33987,7 +34084,7 @@ function EmojisPopup(_ref2) {
|
|
|
33987
34084
|
}));
|
|
33988
34085
|
}))));
|
|
33989
34086
|
}
|
|
33990
|
-
var Container$
|
|
34087
|
+
var Container$g = styled.div(_templateObject$A || (_templateObject$A = _taggedTemplateLiteralLoose(["\n position: ", ";\n left: ", ";\n right: ", ";\n direction: ", ";\n bottom: ", ";\n width: 306px;\n border: ", ";\n box-sizing: border-box;\n box-shadow: 0 0 12px rgba(0, 0, 0, 0.08);\n border-radius: ", ";\n background: ", ";\n z-index: 35;\n //transform: scaleY(0);\n height: 0;\n overflow: hidden;\n transform-origin: ", ";\n transition: all 0.2s ease-in-out;\n ", ";\n"])), function (props) {
|
|
33991
34088
|
return props.relativePosition ? 'relative' : 'absolute';
|
|
33992
34089
|
}, function (props) {
|
|
33993
34090
|
return props.rtlDirection ? '' : props.rightSide ? '' : '5px';
|
|
@@ -34008,7 +34105,7 @@ var Container$f = styled.div(_templateObject$z || (_templateObject$z = _taggedTe
|
|
|
34008
34105
|
}, function (props) {
|
|
34009
34106
|
return props.rendered && "\n height: 225px;\n ";
|
|
34010
34107
|
});
|
|
34011
|
-
var EmojiHeader = styled.div(_templateObject2$
|
|
34108
|
+
var EmojiHeader = styled.div(_templateObject2$v || (_templateObject2$v = _taggedTemplateLiteralLoose(["\n align-items: flex-end;\n font-style: normal;\n font-weight: 500;\n font-size: 12px;\n line-height: 22px;\n text-transform: uppercase;\n color: ", ";\n display: flex;\n padding: ", ";\n"])), function (props) {
|
|
34012
34109
|
return props.color;
|
|
34013
34110
|
}, function (props) {
|
|
34014
34111
|
return props.padding || '6px 18px';
|
|
@@ -34019,7 +34116,7 @@ var EmojiCollection = styled.span(_templateObject4$l || (_templateObject4$l = _t
|
|
|
34019
34116
|
});
|
|
34020
34117
|
var CollectionPointer = styled.span(_templateObject5$h || (_templateObject5$h = _taggedTemplateLiteralLoose([""])));
|
|
34021
34118
|
var AllEmojis = styled.ul(_templateObject6$f || (_templateObject6$f = _taggedTemplateLiteralLoose(["\n overflow: hidden;\n padding: 0 8px 8px;\n margin: 0;\n"])));
|
|
34022
|
-
var EmojiFooter = styled.div(_templateObject7$
|
|
34119
|
+
var EmojiFooter = styled.div(_templateObject7$e || (_templateObject7$e = _taggedTemplateLiteralLoose(["\n height: 42px;\n display: flex;\n justify-content: space-around;\n align-items: center;\n border-top: ", ";\n border-bottom: ", ";\n padding: 0 10px;\n & > span {\n width: 100%;\n text-align: center;\n }\n"])), function (props) {
|
|
34023
34120
|
return props.emojisCategoryIconsPosition !== 'top' && "1px solid " + props.borderColor;
|
|
34024
34121
|
}, function (props) {
|
|
34025
34122
|
return props.emojisCategoryIconsPosition === 'top' && "1px solid " + props.borderColor;
|
|
@@ -34051,7 +34148,7 @@ function SvgPlus(props) {
|
|
|
34051
34148
|
})));
|
|
34052
34149
|
}
|
|
34053
34150
|
|
|
34054
|
-
var _templateObject$
|
|
34151
|
+
var _templateObject$B, _templateObject2$w, _templateObject3$q;
|
|
34055
34152
|
function FrequentlyEmojis(_ref) {
|
|
34056
34153
|
var handleAddEmoji = _ref.handleAddEmoji,
|
|
34057
34154
|
handleEmojiPopupToggle = _ref.handleEmojiPopupToggle,
|
|
@@ -34152,7 +34249,7 @@ function FrequentlyEmojis(_ref) {
|
|
|
34152
34249
|
}
|
|
34153
34250
|
setRendered(true);
|
|
34154
34251
|
}, []);
|
|
34155
|
-
return /*#__PURE__*/React__default.createElement(Container$
|
|
34252
|
+
return /*#__PURE__*/React__default.createElement(Container$h, {
|
|
34156
34253
|
id: 'emojisContainer',
|
|
34157
34254
|
backgroundColor: backgroundSections,
|
|
34158
34255
|
rendered: rendered,
|
|
@@ -34176,14 +34273,14 @@ function FrequentlyEmojis(_ref) {
|
|
|
34176
34273
|
iconColor: textSecondary
|
|
34177
34274
|
}, /*#__PURE__*/React__default.createElement(SvgPlus, null)));
|
|
34178
34275
|
}
|
|
34179
|
-
var Container$
|
|
34276
|
+
var Container$h = styled.div(_templateObject$B || (_templateObject$B = _taggedTemplateLiteralLoose(["\n transform: scale(0, 0);\n transform-origin: ", ";\n display: flex;\n align-items: center;\n padding: 6px;\n background-color: ", ";\n box-shadow: 0 3px 10px -4px rgba(0, 0, 0, 0.2);\n border-radius: 24px;\n overflow: hidden;\n box-sizing: border-box;\n transition: all 0.2s ease-in-out;\n ", ";\n"])), function (props) {
|
|
34180
34277
|
return props.rightSide ? '100% 100%' : '0 100%';
|
|
34181
34278
|
}, function (props) {
|
|
34182
34279
|
return props.backgroundColor;
|
|
34183
34280
|
}, function (props) {
|
|
34184
34281
|
return props.rendered && "\n transform: scale(1, 1);\n ";
|
|
34185
34282
|
});
|
|
34186
|
-
var EmojiItem = styled.span(_templateObject2$
|
|
34283
|
+
var EmojiItem = styled.span(_templateObject2$w || (_templateObject2$w = _taggedTemplateLiteralLoose(["\n font-family:\n apple color emoji,\n segoe ui emoji,\n noto color emoji,\n android emoji,\n emojisymbols,\n emojione mozilla,\n twemoji mozilla,\n segoe ui symbol;\n display: flex;\n align-items: center;\n justify-content: center;\n margin-right: 8px;\n font-size: 28px;\n line-height: 32px;\n cursor: pointer;\n border-radius: 50%;\n width: 36px;\n height: 36px;\n background-color: ", ";\n &:hover {\n background-color: ", ";\n }\n"])), function (props) {
|
|
34187
34284
|
return props.active && props.activeBackground;
|
|
34188
34285
|
}, function (props) {
|
|
34189
34286
|
return props.activeBackground;
|
|
@@ -34198,7 +34295,7 @@ var OpenMoreEmojis = styled.span(_templateObject3$q || (_templateObject3$q = _ta
|
|
|
34198
34295
|
return props.iconHoverColor;
|
|
34199
34296
|
});
|
|
34200
34297
|
|
|
34201
|
-
var _templateObject$
|
|
34298
|
+
var _templateObject$C, _templateObject2$x, _templateObject3$r, _templateObject4$m;
|
|
34202
34299
|
var MessageStatusAndTime = function MessageStatusAndTime(_ref) {
|
|
34203
34300
|
var message = _ref.message,
|
|
34204
34301
|
_ref$messageStatusDis = _ref.messageStatusDisplayingType,
|
|
@@ -34260,10 +34357,10 @@ var MessageStatusAndTime = function MessageStatusAndTime(_ref) {
|
|
|
34260
34357
|
var MessageStatusAndTime$1 = /*#__PURE__*/React__default.memo(MessageStatusAndTime, function (prevProps, nextProps) {
|
|
34261
34358
|
return prevProps.message.state === nextProps.message.state && prevProps.message.deliveryStatus === nextProps.message.deliveryStatus && prevProps.message.createdAt === nextProps.message.createdAt && prevProps.showMessageTimeAndStatusOnlyOnHover === nextProps.showMessageTimeAndStatusOnlyOnHover && 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.messageStatusAndTimeLineHeight === nextProps.messageStatusAndTimeLineHeight && prevProps.messageTimeColor === nextProps.messageTimeColor && prevProps.messageTimeVisible === nextProps.messageTimeVisible && prevProps.messageStatusVisible === nextProps.messageStatusVisible && prevProps.ownMessageOnRightSide === nextProps.ownMessageOnRightSide && prevProps.bottomOfMessage === nextProps.bottomOfMessage && prevProps.marginBottom === nextProps.marginBottom && prevProps.messageTimeColorOnAttachment === nextProps.messageTimeColorOnAttachment && prevProps.withAttachment === nextProps.withAttachment;
|
|
34262
34359
|
});
|
|
34263
|
-
var MessageStatus = styled.span(_templateObject$
|
|
34360
|
+
var MessageStatus = styled.span(_templateObject$C || (_templateObject$C = _taggedTemplateLiteralLoose(["\n display: inline-flex;\n align-items: center;\n margin-left: 4px;\n text-align: right;\n height: ", ";\n\n & > svg {\n height: 16px;\n width: 16px;\n }\n"])), function (props) {
|
|
34264
34361
|
return props.height || '14px';
|
|
34265
34362
|
});
|
|
34266
|
-
var HiddenMessageTime = styled.span(_templateObject2$
|
|
34363
|
+
var HiddenMessageTime = styled.span(_templateObject2$x || (_templateObject2$x = _taggedTemplateLiteralLoose(["\n display: ", ";\n font-weight: 400;\n font-size: ", ";\n color: ", ";\n"])), function (props) {
|
|
34267
34364
|
return props.hide && 'none';
|
|
34268
34365
|
}, function (props) {
|
|
34269
34366
|
return props.fontSize || '12px';
|
|
@@ -34303,7 +34400,7 @@ var MessageStatusUpdated = styled.span(_templateObject4$m || (_templateObject4$m
|
|
|
34303
34400
|
return props.color;
|
|
34304
34401
|
});
|
|
34305
34402
|
|
|
34306
|
-
var _templateObject$
|
|
34403
|
+
var _templateObject$D, _templateObject2$y, _templateObject3$s, _templateObject4$n, _templateObject5$i, _templateObject6$g, _templateObject7$f, _templateObject8$d, _templateObject9$b, _templateObject0$a, _templateObject1$7, _templateObject10$4;
|
|
34307
34404
|
var POLL_VOTES_LIMIT = 20;
|
|
34308
34405
|
var AllVotesPopup = function AllVotesPopup(_ref) {
|
|
34309
34406
|
var _pollVotesHasMore$key, _poll$voteDetails, _poll$voteDetails$vot, _poll$voteDetails3;
|
|
@@ -34417,8 +34514,8 @@ var AllVotesPopup = function AllVotesPopup(_ref) {
|
|
|
34417
34514
|
color: textSecondary
|
|
34418
34515
|
}, "Loading...")))))));
|
|
34419
34516
|
};
|
|
34420
|
-
var VotesList = styled.div(_templateObject$
|
|
34421
|
-
var VoterRow = styled.div(_templateObject2$
|
|
34517
|
+
var VotesList = styled.div(_templateObject$D || (_templateObject$D = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n overflow-y: auto;\n max-height: 500px;\n padding: 8px 0;\n"])));
|
|
34518
|
+
var VoterRow = styled.div(_templateObject2$y || (_templateObject2$y = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n gap: 12px;\n padding: 6px 0;\n"])));
|
|
34422
34519
|
var VoterInfo = styled.div(_templateObject3$s || (_templateObject3$s = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n gap: 10px;\n width: 100%;\n justify-content: space-between;\n"])));
|
|
34423
34520
|
var VoterName = styled.div(_templateObject4$n || (_templateObject4$n = _taggedTemplateLiteralLoose(["\n color: ", ";\n font-weight: 500;\n font-size: 15px;\n line-height: 20px;\n letter-spacing: -0.2px;\n max-width: calc(100% - 120px);\n"])), function (p) {
|
|
34424
34521
|
return p.color;
|
|
@@ -34429,7 +34526,7 @@ var VotedAt = styled.div(_templateObject5$i || (_templateObject5$i = _taggedTemp
|
|
|
34429
34526
|
var LoadingText = styled.div(_templateObject6$g || (_templateObject6$g = _taggedTemplateLiteralLoose(["\n color: ", ";\n text-align: center;\n padding: 16px;\n font-size: 14px;\n"])), function (p) {
|
|
34430
34527
|
return p.color;
|
|
34431
34528
|
});
|
|
34432
|
-
var TitleWrapper = styled.div(_templateObject7$
|
|
34529
|
+
var TitleWrapper = styled.div(_templateObject7$f || (_templateObject7$f = _taggedTemplateLiteralLoose(["\n max-width: calc(100% - 54px);\n margin: 0 auto;\n"])));
|
|
34433
34530
|
var BackButton = styled.button(_templateObject8$d || (_templateObject8$d = _taggedTemplateLiteralLoose(["\n position: absolute;\n left: 13px;\n top: 13px;\n padding: 9px;\n cursor: pointer;\n box-sizing: content-box;\n background: transparent;\n border: none;\n display: flex;\n align-items: center;\n justify-content: center;\n color: ", ";\n flex-shrink: 0;\n\n & > svg {\n width: 24px;\n height: 24px;\n }\n\n &:hover {\n opacity: 0.7;\n }\n"])), function (p) {
|
|
34434
34531
|
return p.color;
|
|
34435
34532
|
});
|
|
@@ -34446,7 +34543,7 @@ var Loader = styled.div(_templateObject10$4 || (_templateObject10$4 = _taggedTem
|
|
|
34446
34543
|
return p.color;
|
|
34447
34544
|
});
|
|
34448
34545
|
|
|
34449
|
-
var _templateObject$
|
|
34546
|
+
var _templateObject$E, _templateObject2$z, _templateObject3$t, _templateObject4$o, _templateObject5$j, _templateObject6$h, _templateObject7$g, _templateObject8$e, _templateObject9$c, _templateObject0$b, _templateObject1$8, _templateObject10$5;
|
|
34450
34547
|
var VotesResultsPopup = function VotesResultsPopup(_ref) {
|
|
34451
34548
|
var _poll$voteDetails3, _poll$voteDetails4, _poll$options$find;
|
|
34452
34549
|
var onClose = _ref.onClose,
|
|
@@ -34574,8 +34671,8 @@ var VotesResultsPopup = function VotesResultsPopup(_ref) {
|
|
|
34574
34671
|
})) === null || _poll$options$find === void 0 ? void 0 : _poll$options$find.name) || ''
|
|
34575
34672
|
})));
|
|
34576
34673
|
};
|
|
34577
|
-
var OptionsList = styled.div(_templateObject$
|
|
34578
|
-
var OptionBlock = styled.div(_templateObject2$
|
|
34674
|
+
var OptionsList = styled.div(_templateObject$E || (_templateObject$E = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n gap: 16px;\n overflow-y: auto;\n max-height: 504px;\n border-radius: 10px;\n"])));
|
|
34675
|
+
var OptionBlock = styled.div(_templateObject2$z || (_templateObject2$z = _taggedTemplateLiteralLoose(["\n background: ", ";\n border-radius: 10px;\n border: 1px solid ", "0F; /* subtle */\n padding: 14px 16px 0 16px;\n"])), function (p) {
|
|
34579
34676
|
return p.background;
|
|
34580
34677
|
}, function (p) {
|
|
34581
34678
|
return p.border;
|
|
@@ -34588,7 +34685,7 @@ var OptionCount = styled.div(_templateObject5$j || (_templateObject5$j = _tagged
|
|
|
34588
34685
|
return p.color;
|
|
34589
34686
|
});
|
|
34590
34687
|
var Voters = styled.div(_templateObject6$h || (_templateObject6$h = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n margin-bottom: 5px;\n"])));
|
|
34591
|
-
var VoterRow$1 = styled.div(_templateObject7$
|
|
34688
|
+
var VoterRow$1 = styled.div(_templateObject7$g || (_templateObject7$g = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n gap: 12px;\n padding: 6px 0;\n"])));
|
|
34592
34689
|
var VoterInfo$1 = styled.div(_templateObject8$e || (_templateObject8$e = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n gap: 10px;\n width: 100%;\n justify-content: space-between;\n"])));
|
|
34593
34690
|
var VoterName$1 = styled.div(_templateObject9$c || (_templateObject9$c = _taggedTemplateLiteralLoose(["\n color: ", ";\n font-weight: 500;\n font-size: 15px;\n line-height: 20px;\n letter-spacing: -0.2px;\n max-width: calc(100% - 120px);\n"])), function (p) {
|
|
34594
34691
|
return p.color;
|
|
@@ -34625,7 +34722,7 @@ function SvgFilledCheckbox(props) {
|
|
|
34625
34722
|
})));
|
|
34626
34723
|
}
|
|
34627
34724
|
|
|
34628
|
-
var _templateObject$
|
|
34725
|
+
var _templateObject$F, _templateObject2$A, _templateObject3$u, _templateObject4$p, _templateObject5$k, _templateObject6$i, _templateObject7$h, _templateObject8$f, _templateObject9$d, _templateObject0$c, _templateObject1$9, _templateObject10$6, _templateObject11$4, _templateObject12$3;
|
|
34629
34726
|
var PollMessage = function PollMessage(_ref) {
|
|
34630
34727
|
var _poll$voteDetails3, _poll$voteDetails4, _poll$voteDetails5, _poll$voteDetails6, _poll$voteDetails7;
|
|
34631
34728
|
var message = _ref.message;
|
|
@@ -34674,7 +34771,7 @@ var PollMessage = function PollMessage(_ref) {
|
|
|
34674
34771
|
var handleViewResults = function handleViewResults() {
|
|
34675
34772
|
return setShowResults(true);
|
|
34676
34773
|
};
|
|
34677
|
-
return /*#__PURE__*/React__default.createElement(Container$
|
|
34774
|
+
return /*#__PURE__*/React__default.createElement(Container$i, null, /*#__PURE__*/React__default.createElement(Question$1, {
|
|
34678
34775
|
color: textPrimary
|
|
34679
34776
|
}, poll.name), /*#__PURE__*/React__default.createElement(SubTitle$1, {
|
|
34680
34777
|
color: textSecondary
|
|
@@ -34726,7 +34823,7 @@ var PollMessage = function PollMessage(_ref) {
|
|
|
34726
34823
|
});
|
|
34727
34824
|
}))), /*#__PURE__*/React__default.createElement(Votes, {
|
|
34728
34825
|
color: textPrimary
|
|
34729
|
-
}, votes)), /*#__PURE__*/React__default.createElement(Bar, {
|
|
34826
|
+
}, votes)), /*#__PURE__*/React__default.createElement(Bar$1, {
|
|
34730
34827
|
track: borderSecondary,
|
|
34731
34828
|
closed: poll.closed
|
|
34732
34829
|
}, /*#__PURE__*/React__default.createElement(Fill, {
|
|
@@ -34755,8 +34852,8 @@ var PollMessage = function PollMessage(_ref) {
|
|
|
34755
34852
|
messageId: message.id
|
|
34756
34853
|
})));
|
|
34757
34854
|
};
|
|
34758
|
-
var Container$
|
|
34759
|
-
var Question$1 = styled.div(_templateObject2$
|
|
34855
|
+
var Container$i = styled.div(_templateObject$F || (_templateObject$F = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n min-width: 250px;\n width: 100%;\n"])));
|
|
34856
|
+
var Question$1 = styled.div(_templateObject2$A || (_templateObject2$A = _taggedTemplateLiteralLoose(["\n color: ", ";\n font-weight: 500;\n font-size: 15px;\n line-height: 18px;\n letter-spacing: -0.4px;\n word-break: break-word;\n"])), function (p) {
|
|
34760
34857
|
return p.color;
|
|
34761
34858
|
});
|
|
34762
34859
|
var SubTitle$1 = styled.div(_templateObject3$u || (_templateObject3$u = _taggedTemplateLiteralLoose(["\n color: ", ";\n margin: 4px 0 6px 0;\n font-weight: 400;\n font-size: 13px;\n line-height: 16px;\n letter-spacing: -0.08px;\n word-break: break-word;\n"])), function (p) {
|
|
@@ -34769,7 +34866,7 @@ var Option = styled.div(_templateObject5$k || (_templateObject5$k = _taggedTempl
|
|
|
34769
34866
|
return p.disabled ? 'not-allowed' : 'pointer';
|
|
34770
34867
|
});
|
|
34771
34868
|
var TopRow = styled.div(_templateObject6$i || (_templateObject6$i = _taggedTemplateLiteralLoose(["\n display: flex;\n margin-bottom: 6px;\n min-height: 22px;\n"])));
|
|
34772
|
-
var Indicator = styled.div(_templateObject7$
|
|
34869
|
+
var Indicator = styled.div(_templateObject7$h || (_templateObject7$h = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n justify-content: center;\n width: 20px;\n min-width: 20px;\n height: 20px;\n margin-right: 8px;\n opacity: ", ";\n cursor: ", ";\n"])), function (p) {
|
|
34773
34870
|
return p.disabled ? 0.5 : 1;
|
|
34774
34871
|
}, function (p) {
|
|
34775
34872
|
return p.disabled ? 'not-allowed' : 'pointer';
|
|
@@ -34786,7 +34883,7 @@ var Title$2 = styled.div(_templateObject0$c || (_templateObject0$c = _taggedTemp
|
|
|
34786
34883
|
var Votes = styled.span(_templateObject1$9 || (_templateObject1$9 = _taggedTemplateLiteralLoose(["\n color: ", ";\n font-weight: 400;\n font-size: 14px;\n line-height: 20px;\n letter-spacing: -0.2px;\n margin-left: 4px;\n"])), function (p) {
|
|
34787
34884
|
return p.color;
|
|
34788
34885
|
});
|
|
34789
|
-
var Bar = styled.div(_templateObject10$6 || (_templateObject10$6 = _taggedTemplateLiteralLoose(["\n width: ", ";\n height: 6px;\n border-radius: 6px;\n background: ", ";\n overflow: hidden;\n margin-left: auto;\n"])), function (p) {
|
|
34886
|
+
var Bar$1 = styled.div(_templateObject10$6 || (_templateObject10$6 = _taggedTemplateLiteralLoose(["\n width: ", ";\n height: 6px;\n border-radius: 6px;\n background: ", ";\n overflow: hidden;\n margin-left: auto;\n"])), function (p) {
|
|
34790
34887
|
return p.closed ? '100%' : "calc(100% - 28px)";
|
|
34791
34888
|
}, function (p) {
|
|
34792
34889
|
return p.track;
|
|
@@ -34794,7 +34891,7 @@ var Bar = styled.div(_templateObject10$6 || (_templateObject10$6 = _taggedTempla
|
|
|
34794
34891
|
var Fill = styled.div(_templateObject11$4 || (_templateObject11$4 = _taggedTemplateLiteralLoose(["\n height: 100%;\n border-radius: 6px;\n transition: width 0.3s ease-in-out;\n"])));
|
|
34795
34892
|
var UsersContainer = styled.div(_templateObject12$3 || (_templateObject12$3 = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n margin-left: auto;\n padding-left: 16px;\n height: max-content;\n"])));
|
|
34796
34893
|
|
|
34797
|
-
var _templateObject$
|
|
34894
|
+
var _templateObject$G, _templateObject2$B, _templateObject3$v, _templateObject4$q, _templateObject5$l, _templateObject6$j, _templateObject7$i, _templateObject8$g, _templateObject9$e, _templateObject0$d, _templateObject1$a;
|
|
34798
34895
|
var validateUrl = function validateUrl(url) {
|
|
34799
34896
|
try {
|
|
34800
34897
|
var urlObj = new URL(url);
|
|
@@ -35154,7 +35251,7 @@ var OGMetadata = function OGMetadata(_ref) {
|
|
|
35154
35251
|
}), content);
|
|
35155
35252
|
};
|
|
35156
35253
|
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";
|
|
35157
|
-
var OGMetadataContainer = styled.div(_templateObject$
|
|
35254
|
+
var OGMetadataContainer = styled.div(_templateObject$G || (_templateObject$G = _taggedTemplateLiteralLoose(["\n min-width: inherit;\n max-width: ", ";\n width: 100%;\n display: grid;\n grid-template-columns: 1fr;\n border-radius: 8px;\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) {
|
|
35158
35255
|
var maxWidth = _ref2.maxWidth;
|
|
35159
35256
|
return maxWidth ? maxWidth + "px" : 'inherit';
|
|
35160
35257
|
}, function (_ref3) {
|
|
@@ -35175,7 +35272,7 @@ var OGMetadataContainer = styled.div(_templateObject$F || (_templateObject$F = _
|
|
|
35175
35272
|
var padding = _ref7.padding;
|
|
35176
35273
|
return padding != null ? padding : '0';
|
|
35177
35274
|
});
|
|
35178
|
-
var ImageContainer = styled.div(_templateObject2$
|
|
35275
|
+
var ImageContainer = styled.div(_templateObject2$B || (_templateObject2$B = _taggedTemplateLiteralLoose(["\n ", "\n width: 100%;\n height: ", ";\n opacity: ", ";\n margin: 0 auto;\n border-radius: 8px 8px 0 0;\n overflow: hidden;\n ", "\n"])), sharedKeyframes, function (_ref8) {
|
|
35179
35276
|
var containerHeight = _ref8.containerHeight;
|
|
35180
35277
|
return containerHeight ? containerHeight + "px" : '0px';
|
|
35181
35278
|
}, function (_ref9) {
|
|
@@ -35231,7 +35328,7 @@ var Url = styled.p(_templateObject6$j || (_templateObject6$j = _taggedTemplateLi
|
|
|
35231
35328
|
var shouldAnimate = _ref21.shouldAnimate;
|
|
35232
35329
|
return shouldAnimate && "\n animation: fadeInSlideUp 0.3s ease-out 0.3s backwards;\n ";
|
|
35233
35330
|
});
|
|
35234
|
-
var Img = styled.img(_templateObject7$
|
|
35331
|
+
var Img = styled.img(_templateObject7$i || (_templateObject7$i = _taggedTemplateLiteralLoose(["\n ", "\n width: 100%;\n height: 100%;\n object-fit: cover;\n display: block;\n // object-fit: cover;\n // object-position: center;\n // image-rendering: auto;\n border-radius: inherit;\n ", "\n"])), sharedKeyframes, function (_ref22) {
|
|
35235
35332
|
var shouldAnimate = _ref22.shouldAnimate;
|
|
35236
35333
|
return shouldAnimate && "\n animation: fadeIn 0.4s ease-out forwards;\n ";
|
|
35237
35334
|
});
|
|
@@ -35240,7 +35337,7 @@ var OGTextWrapper = styled.div(_templateObject9$e || (_templateObject9$e = _tagg
|
|
|
35240
35337
|
var FaviconContainer = styled.div(_templateObject0$d || (_templateObject0$d = _taggedTemplateLiteralLoose(["\n width: 52px;\n height: 52px;\n border-radius: 8px;\n overflow: hidden;\n margin: 8px;\n flex: 0 0 52px;\n"])));
|
|
35241
35338
|
var FaviconImg = styled.img(_templateObject1$a || (_templateObject1$a = _taggedTemplateLiteralLoose(["\n width: 100%;\n height: 100%;\n object-fit: cover;\n display: block;\n"])));
|
|
35242
35339
|
|
|
35243
|
-
var _templateObject$
|
|
35340
|
+
var _templateObject$H, _templateObject2$C, _templateObject3$w, _templateObject4$r, _templateObject5$m;
|
|
35244
35341
|
var MessageBody = function MessageBody(_ref) {
|
|
35245
35342
|
var message = _ref.message,
|
|
35246
35343
|
channel = _ref.channel,
|
|
@@ -35833,7 +35930,7 @@ var MessageBody$1 = /*#__PURE__*/React__default.memo(MessageBody, function (prev
|
|
|
35833
35930
|
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;
|
|
35834
35931
|
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));
|
|
35835
35932
|
});
|
|
35836
|
-
var ForwardedTitle = styled.h3(_templateObject$
|
|
35933
|
+
var ForwardedTitle = styled.h3(_templateObject$H || (_templateObject$H = _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) {
|
|
35837
35934
|
return props.color;
|
|
35838
35935
|
}, function (props) {
|
|
35839
35936
|
return props.withAttachments && props.withBody ? '0' : '0 0 4px';
|
|
@@ -35846,7 +35943,7 @@ var ForwardedTitle = styled.h3(_templateObject$G || (_templateObject$G = _tagged
|
|
|
35846
35943
|
}, function (props) {
|
|
35847
35944
|
return props.color;
|
|
35848
35945
|
});
|
|
35849
|
-
var MessageStatusDeleted$1 = styled.span(_templateObject2$
|
|
35946
|
+
var MessageStatusDeleted$1 = styled.span(_templateObject2$C || (_templateObject2$C = _taggedTemplateLiteralLoose(["\n color: ", ";\n font-size: ", ";\n font-style: italic;\n"])), function (props) {
|
|
35850
35947
|
return props.color;
|
|
35851
35948
|
}, function (props) {
|
|
35852
35949
|
return props.fontSize;
|
|
@@ -35889,7 +35986,7 @@ var FrequentlyEmojisContainer = styled.div(_templateObject5$m || (_templateObjec
|
|
|
35889
35986
|
return props.rtlDirection && '0';
|
|
35890
35987
|
});
|
|
35891
35988
|
|
|
35892
|
-
var _templateObject$
|
|
35989
|
+
var _templateObject$I, _templateObject2$D, _templateObject3$x, _templateObject4$s, _templateObject5$n, _templateObject6$k, _templateObject7$j, _templateObject8$h, _templateObject9$f, _templateObject0$e, _templateObject1$b;
|
|
35893
35990
|
var defaultFormatDate = function defaultFormatDate(date) {
|
|
35894
35991
|
var m = moment(date);
|
|
35895
35992
|
if (m.isSame(moment(), 'day')) {
|
|
@@ -36261,8 +36358,8 @@ function sortByDateDesc(a, b) {
|
|
|
36261
36358
|
var bTime = bDate ? new Date(bDate).getTime() : 0;
|
|
36262
36359
|
return bTime - aTime;
|
|
36263
36360
|
}
|
|
36264
|
-
var Tabs = styled.div(_templateObject$
|
|
36265
|
-
var Tab = styled.button(_templateObject2$
|
|
36361
|
+
var Tabs = styled.div(_templateObject$I || (_templateObject$I = _taggedTemplateLiteralLoose(["\n display: flex;\n gap: 8px;\n justify-content: start;\n margin-bottom: 8px;\n"])));
|
|
36362
|
+
var Tab = styled.button(_templateObject2$D || (_templateObject2$D = _taggedTemplateLiteralLoose(["\n border: none;\n background: transparent;\n cursor: pointer;\n padding: 6px 11px;\n border-radius: 16px;\n color: ", ";\n background: ", ";\n border: 1px solid ", ";\n &:hover {\n opacity: 0.9;\n }\n font-weight: 500;\n font-size: 15px;\n line-height: 20px;\n letter-spacing: 0px;\n text-align: center;\n"])), function (p) {
|
|
36266
36363
|
return p.active ? p.textOnPrimary : p.textSecondary;
|
|
36267
36364
|
}, function (p) {
|
|
36268
36365
|
return p.background;
|
|
@@ -36279,7 +36376,7 @@ var RowInfo = styled.div(_templateObject5$n || (_templateObject5$n = _taggedTemp
|
|
|
36279
36376
|
var RowTitle = styled.div(_templateObject6$k || (_templateObject6$k = _taggedTemplateLiteralLoose(["\n color: ", ";\n font-size: 16px;\n font-weight: 500;\n line-height: 22px;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n"])), function (p) {
|
|
36280
36377
|
return p.color;
|
|
36281
36378
|
});
|
|
36282
|
-
var RowDate = styled.div(_templateObject7$
|
|
36379
|
+
var RowDate = styled.div(_templateObject7$j || (_templateObject7$j = _taggedTemplateLiteralLoose(["\n color: ", ";\n min-width: max-content;\n font-weight: 400;\n font-size: 13px;\n line-height: 16px;\n"])), function (p) {
|
|
36283
36380
|
return p.color;
|
|
36284
36381
|
});
|
|
36285
36382
|
var Empty = styled.div(_templateObject8$h || (_templateObject8$h = _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) {
|
|
@@ -36323,7 +36420,7 @@ function ConfirmEndPollPopup(_ref) {
|
|
|
36323
36420
|
});
|
|
36324
36421
|
}
|
|
36325
36422
|
|
|
36326
|
-
var _templateObject$
|
|
36423
|
+
var _templateObject$J, _templateObject2$E, _templateObject3$y, _templateObject4$t, _templateObject5$o, _templateObject6$l, _templateObject7$k, _templateObject8$i, _templateObject9$g, _templateObject0$f, _templateObject1$c, _templateObject10$7, _templateObject11$5, _templateObject12$4;
|
|
36327
36424
|
var Message$1 = function Message(_ref) {
|
|
36328
36425
|
var message = _ref.message,
|
|
36329
36426
|
channel = _ref.channel,
|
|
@@ -37125,8 +37222,8 @@ var Message$1 = function Message(_ref) {
|
|
|
37125
37222
|
var Message$2 = /*#__PURE__*/React__default.memo(Message$1, function (prevProps, nextProps) {
|
|
37126
37223
|
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.metadata === nextProps.message.metadata && prevProps.message.userMarkers === nextProps.message.userMarkers && prevProps.message.pollDetails === nextProps.message.pollDetails && 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.theme === nextProps.theme;
|
|
37127
37224
|
});
|
|
37128
|
-
var MessageReactionKey = styled.span(_templateObject$
|
|
37129
|
-
var ReactionItemCount = styled.span(_templateObject2$
|
|
37225
|
+
var MessageReactionKey = styled.span(_templateObject$J || (_templateObject$J = _taggedTemplateLiteralLoose(["\n display: inline-flex;\n align-items: center;\n font-family:\n apple color emoji,\n segoe ui emoji,\n noto color emoji,\n android emoji,\n emojisymbols,\n emojione mozilla,\n twemoji mozilla,\n segoe ui symbol;\n"])));
|
|
37226
|
+
var ReactionItemCount = styled.span(_templateObject2$E || (_templateObject2$E = _taggedTemplateLiteralLoose(["\n margin-left: 2px;\n font-family: Inter, sans-serif;\n font-weight: 400;\n font-size: 14px;\n line-height: 16px;\n color: ", ";\n"])), function (props) {
|
|
37130
37227
|
return props.color;
|
|
37131
37228
|
});
|
|
37132
37229
|
var MessageReaction = styled.span(_templateObject3$y || (_templateObject3$y = _taggedTemplateLiteralLoose(["\n display: inline-flex;\n //min-width: 23px;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n margin: ", ";\n margin-right: ", ";\n border: ", ";\n color: ", ";\n box-sizing: border-box;\n border-radius: ", ";\n font-size: ", ";\n line-height: ", ";\n padding: ", ";\n background-color: ", ";\n white-space: nowrap;\n\n &:last-child {\n margin-right: 0;\n }\n"])), function (props) {
|
|
@@ -37157,7 +37254,7 @@ var FailedMessageIcon = styled.div(_templateObject5$o || (_templateObject5$o = _
|
|
|
37157
37254
|
return props.rtl && '-24px';
|
|
37158
37255
|
});
|
|
37159
37256
|
var ErrorIconWrapper = styled(SvgErrorIcon)(_templateObject6$l || (_templateObject6$l = _taggedTemplateLiteralLoose(["\n width: 20px;\n height: 20px;\n"])));
|
|
37160
|
-
var SelectMessageWrapper = styled.div(_templateObject7$
|
|
37257
|
+
var SelectMessageWrapper = styled.div(_templateObject7$k || (_templateObject7$k = _taggedTemplateLiteralLoose(["\n display: flex;\n padding: 10px;\n position: absolute;\n left: 4%;\n bottom: calc(50% - 22px);\n cursor: ", ";\n & > svg {\n color: ", ";\n width: 24px;\n height: 24px;\n }\n"])), function (props) {
|
|
37161
37258
|
return !props.disabled && 'pointer';
|
|
37162
37259
|
}, function (props) {
|
|
37163
37260
|
return props.activeColor;
|
|
@@ -37228,7 +37325,7 @@ var MessageItem = styled.div(_templateObject12$4 || (_templateObject12$4 = _tagg
|
|
|
37228
37325
|
return props.hoverBackground || '';
|
|
37229
37326
|
}, HiddenMessageTime$1, MessageStatus$1);
|
|
37230
37327
|
|
|
37231
|
-
var _templateObject$
|
|
37328
|
+
var _templateObject$K, _templateObject2$F, _templateObject3$z, _templateObject4$u, _templateObject5$p, _templateObject6$m, _templateObject7$l, _templateObject8$j, _templateObject9$h, _templateObject0$g, _templateObject1$d;
|
|
37232
37329
|
var CreateMessageDateDivider = function CreateMessageDateDivider(_ref) {
|
|
37233
37330
|
var lastIndex = _ref.lastIndex,
|
|
37234
37331
|
currentMessageDate = _ref.currentMessageDate,
|
|
@@ -38095,7 +38192,7 @@ var MessageList = function MessageList(_ref2) {
|
|
|
38095
38192
|
dateDividerBackgroundColor: dateDividerBackgroundColor || overlayBackground,
|
|
38096
38193
|
dateDividerBorderRadius: dateDividerBorderRadius,
|
|
38097
38194
|
topOffset: scrollRef && scrollRef.current && scrollRef.current.offsetTop
|
|
38098
|
-
}, /*#__PURE__*/React__default.createElement("span", null, topDateLabel))), /*#__PURE__*/React__default.createElement(Container$
|
|
38195
|
+
}, /*#__PURE__*/React__default.createElement("span", null, topDateLabel))), /*#__PURE__*/React__default.createElement(Container$j, {
|
|
38099
38196
|
id: 'scrollableDiv',
|
|
38100
38197
|
className: isScrolling ? 'show-scrollbar' : '',
|
|
38101
38198
|
ref: scrollRef,
|
|
@@ -38322,12 +38419,12 @@ var MessageList = function MessageList(_ref2) {
|
|
|
38322
38419
|
attachmentsPreview: attachmentsPreview
|
|
38323
38420
|
})))));
|
|
38324
38421
|
};
|
|
38325
|
-
var Container$
|
|
38422
|
+
var Container$j = styled.div(_templateObject$K || (_templateObject$K = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column-reverse;\n flex-grow: 1;\n position: relative;\n overflow: auto;\n scroll-behavior: smooth;\n will-change: left, top;\n background-color: ", ";\n overflow-x: hidden;\n\n &::-webkit-scrollbar {\n width: 8px;\n background: transparent;\n }\n &::-webkit-scrollbar-thumb {\n background: transparent;\n }\n\n &.show-scrollbar::-webkit-scrollbar-thumb {\n background: ", ";\n border-radius: 4px;\n }\n &.show-scrollbar::-webkit-scrollbar-track {\n background: transparent;\n }\n"])), function (props) {
|
|
38326
38423
|
return props.backgroundColor;
|
|
38327
38424
|
}, function (props) {
|
|
38328
38425
|
return props.thumbColor;
|
|
38329
38426
|
});
|
|
38330
|
-
var EmptyDiv = styled.div(_templateObject2$
|
|
38427
|
+
var EmptyDiv = styled.div(_templateObject2$F || (_templateObject2$F = _taggedTemplateLiteralLoose(["\n height: 300px;\n"])));
|
|
38331
38428
|
var MessagesBox = styled.div(_templateObject3$z || (_templateObject3$z = _taggedTemplateLiteralLoose(["\n //height: auto;\n display: flex;\n //flex-direction: column-reverse;\n flex-direction: column;\n padding-bottom: 20px;\n //overflow: auto;\n //scroll-behavior: unset;\n"])));
|
|
38332
38429
|
var MessageTopDate = styled.div(_templateObject4$u || (_templateObject4$u = _taggedTemplateLiteralLoose(["\n position: absolute;\n justify-content: center;\n width: 100%;\n top: ", ";\n left: 0;\n margin-top: ", ";\n margin-bottom: ", ";\n text-align: center;\n z-index: 10;\n background: transparent;\n opacity: ", ";\n transition: all 0.2s ease-in-out;\n width: calc(100% - 8px);\n\n span {\n display: inline-block;\n max-width: 380px;\n font-style: normal;\n font-weight: normal;\n font-size: ", ";\n color: ", ";\n background-color: ", ";\n border: ", ";\n box-sizing: border-box;\n border-radius: ", ";\n padding: 5px 16px;\n box-shadow:\n 0 0 2px rgba(0, 0, 0, 0.08),\n 0 2px 24px rgba(0, 0, 0, 0.08);\n text-overflow: ellipsis;\n overflow: hidden;\n }\n"])), function (props) {
|
|
38333
38430
|
return props.topOffset ? props.topOffset + 22 + "px" : '22px';
|
|
@@ -38360,7 +38457,7 @@ var IconWrapper$1 = styled.span(_templateObject6$m || (_templateObject6$m = _tag
|
|
|
38360
38457
|
}, function (props) {
|
|
38361
38458
|
return props.iconColor;
|
|
38362
38459
|
});
|
|
38363
|
-
var DropAttachmentArea = styled.div(_templateObject7$
|
|
38460
|
+
var DropAttachmentArea = styled.div(_templateObject7$l || (_templateObject7$l = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n justify-content: center;\n flex-direction: column;\n height: 100%;\n border: 1px dashed ", ";\n border-radius: 16px;\n margin: ", ";\n font-weight: 400;\n font-size: 15px;\n line-height: 18px;\n letter-spacing: -0.2px;\n color: ", ";\n transition: all 0.1s;\n\n &.dragover {\n background-color: ", ";\n border: 1px dashed ", ";\n\n ", " {\n background-color: ", ";\n }\n }\n"])), function (props) {
|
|
38364
38461
|
return props.borderColor;
|
|
38365
38462
|
}, function (props) {
|
|
38366
38463
|
return props.margin || '12px 32px 32px';
|
|
@@ -38799,7 +38896,7 @@ function $isMentionNode(node) {
|
|
|
38799
38896
|
return node instanceof MentionNode;
|
|
38800
38897
|
}
|
|
38801
38898
|
|
|
38802
|
-
var _templateObject$
|
|
38899
|
+
var _templateObject$L, _templateObject2$G, _templateObject3$A, _templateObject4$v, _templateObject5$q;
|
|
38803
38900
|
var PUNCTUATION = '\\.,\\+\\*\\?\\$\\@\\|#{}\\(\\)\\^\\-\\[\\]\\\\/!%\'"~=<>_:;';
|
|
38804
38901
|
var NAME = '\\b[A-Z][^\\s' + PUNCTUATION + ']';
|
|
38805
38902
|
var DocumentMentionsRegex = {
|
|
@@ -39079,8 +39176,8 @@ function MentionsPlugin(_ref3) {
|
|
|
39079
39176
|
}
|
|
39080
39177
|
});
|
|
39081
39178
|
}
|
|
39082
|
-
var MentionsContainerWrapper = styled.div(_templateObject$
|
|
39083
|
-
var MentionsList = styled.ul(_templateObject2$
|
|
39179
|
+
var MentionsContainerWrapper = styled.div(_templateObject$L || (_templateObject$L = _taggedTemplateLiteralLoose(["\n position: relative;\n animation: fadeIn 0.2s ease-in-out;\n @keyframes fadeIn {\n from {\n opacity: 0;\n }\n to {\n opacity: 1;\n }\n }\n"])));
|
|
39180
|
+
var MentionsList = styled.ul(_templateObject2$G || (_templateObject2$G = _taggedTemplateLiteralLoose(["\n position: absolute;\n bottom: 100%;\n width: 300px;\n transition: all 0.2s;\n overflow: auto;\n max-height: 240px;\n z-index: 200;\n padding: 2px 0 0;\n background: ", ";\n border: ", ";\n box-sizing: border-box;\n box-shadow: ", ";\n border-radius: 6px;\n visibility: ", ";\n"])), function (props) {
|
|
39084
39181
|
return props.backgroundColor;
|
|
39085
39182
|
}, function (props) {
|
|
39086
39183
|
return props.withBorder && "1px solid " + props.borderColor;
|
|
@@ -39226,7 +39323,7 @@ function SvgUnderline(props) {
|
|
|
39226
39323
|
}))));
|
|
39227
39324
|
}
|
|
39228
39325
|
|
|
39229
|
-
var _templateObject$
|
|
39326
|
+
var _templateObject$M, _templateObject2$H;
|
|
39230
39327
|
function mergeRegister() {
|
|
39231
39328
|
for (var _len = arguments.length, func = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
39232
39329
|
func[_key] = arguments[_key];
|
|
@@ -39607,10 +39704,10 @@ function FloatingTextFormatToolbarPlugin(_ref3) {
|
|
|
39607
39704
|
editor = _useLexicalComposerCo[0];
|
|
39608
39705
|
return useFloatingTextFormatToolbar(editor, anchorElem);
|
|
39609
39706
|
}
|
|
39610
|
-
var FloatingTextFormatPopup = styled.div(_templateObject$
|
|
39707
|
+
var FloatingTextFormatPopup = styled.div(_templateObject$M || (_templateObject$M = _taggedTemplateLiteralLoose(["\n display: flex;\n background: ", ";\n vertical-align: middle;\n position: absolute;\n top: 0;\n left: 0;\n opacity: 0;\n box-shadow: 0 5px 10px rgba(0, 0, 0, 0.3);\n border-radius: 8px;\n transition: opacity 0.5s;\n padding: 12px;\n will-change: transform;\n z-index: 99;\n\n & button.popup-item {\n border: 0;\n display: flex;\n background: none;\n border-radius: 10px;\n padding: 8px;\n cursor: pointer;\n vertical-align: middle;\n }\n & button.popup-item:disabled {\n cursor: not-allowed;\n }\n & button.popup-item.spaced {\n margin-right: 2px;\n }\n & button.popup-item i.format {\n background-size: contain;\n height: 18px;\n width: 18px;\n margin-top: 2px;\n vertical-align: -0.25em;\n display: flex;\n opacity: 0.6;\n }\n\n & button.popup-item:disabled i.format {\n opacity: 0.2;\n }\n & button.popup-item.active {\n background-color: rgba(223, 232, 250, 0.3);\n }\n & button.popup-item.active i {\n opacity: 1;\n }\n & .popup-item:hover:not([disabled]) {\n background-color: #eee;\n }\n & select.popup-item {\n border: 0;\n display: flex;\n background: none;\n border-radius: 10px;\n padding: 8px;\n vertical-align: middle;\n -webkit-appearance: none;\n -moz-appearance: none;\n width: 70px;\n font-size: 14px;\n color: #777;\n text-overflow: ellipsis;\n }\n & select.code-language {\n text-transform: capitalize;\n width: 130px;\n }\n\n & .popup-item .text {\n display: flex;\n line-height: 20px;\n vertical-align: middle;\n font-size: 14px;\n color: #777;\n text-overflow: ellipsis;\n width: 70px;\n overflow: hidden;\n height: 20px;\n text-align: left;\n }\n\n & .popup-item .icon {\n display: flex;\n width: 20px;\n height: 20px;\n user-select: none;\n margin-right: 8px;\n line-height: 16px;\n background-size: contain;\n }\n & i.chevron-down {\n margin-top: 3px;\n width: 16px;\n height: 16px;\n display: flex;\n user-select: none;\n }\n & i.chevron-down.inside {\n width: 16px;\n height: 16px;\n display: flex;\n margin-left: -25px;\n margin-top: 11px;\n margin-right: 10px;\n pointer-events: none;\n }\n & .divider {\n width: 1px;\n background-color: #eee;\n margin: 0 4px;\n }\n @media (max-width: 1024px) {\n & button.insert-comment {\n display: none;\n }\n }\n"])), function (props) {
|
|
39611
39708
|
return props.popupColor;
|
|
39612
39709
|
});
|
|
39613
|
-
var Action$1 = styled.button(_templateObject2$
|
|
39710
|
+
var Action$1 = styled.button(_templateObject2$H || (_templateObject2$H = _taggedTemplateLiteralLoose(["\n border: 0;\n display: flex;\n background-color: inherit;\n vertical-align: middle;\n position: relative;\n padding: 3px;\n margin-right: 10px;\n //margin: 8px 6px;\n cursor: pointer;\n transition: all 0.2s;\n color: ", ";\n border-radius: 50%;\n ", "\n\n &:last-child {\n margin-right: 0;\n }\n\n &:hover {\n color: ", ";\n background-color: ", ";\n\n ", " {\n display: block;\n }\n }\n"])), function (props) {
|
|
39614
39711
|
return props.iconColor;
|
|
39615
39712
|
}, function (props) {
|
|
39616
39713
|
return props.isActive && "\n color: " + props.hoverIconColor + ";\n background-color: " + props.hoverBackgroundColor + ";\n ";
|
|
@@ -39933,7 +40030,7 @@ function FormatMessagePlugin(_ref) {
|
|
|
39933
40030
|
return null;
|
|
39934
40031
|
}
|
|
39935
40032
|
|
|
39936
|
-
var _templateObject$
|
|
40033
|
+
var _templateObject$N, _templateObject2$I, _templateObject3$B, _templateObject4$w, _templateObject5$r, _templateObject6$n, _templateObject7$m, _templateObject8$k;
|
|
39937
40034
|
var EmojiIcon$1 = function EmojiIcon(_ref) {
|
|
39938
40035
|
var collectionName = _ref.collectionName;
|
|
39939
40036
|
switch (collectionName) {
|
|
@@ -40052,7 +40149,7 @@ function EmojisPopup$1(_ref2) {
|
|
|
40052
40149
|
}
|
|
40053
40150
|
}, 300);
|
|
40054
40151
|
}, []);
|
|
40055
|
-
return /*#__PURE__*/React__default.createElement(Container$
|
|
40152
|
+
return /*#__PURE__*/React__default.createElement(Container$k, {
|
|
40056
40153
|
backgroundColor: backgroundSections,
|
|
40057
40154
|
borderColor: border,
|
|
40058
40155
|
relativePosition: relativePosition,
|
|
@@ -40128,7 +40225,7 @@ function EmojisPopup$1(_ref2) {
|
|
|
40128
40225
|
}));
|
|
40129
40226
|
}))));
|
|
40130
40227
|
}
|
|
40131
|
-
var Container$
|
|
40228
|
+
var Container$k = styled.div(_templateObject$N || (_templateObject$N = _taggedTemplateLiteralLoose(["\n position: ", ";\n left: ", ";\n right: ", ";\n direction: ", ";\n bottom: ", ";\n width: 306px;\n border: ", ";\n box-sizing: border-box;\n box-shadow: 0 0 12px rgba(0, 0, 0, 0.08);\n border-radius: ", ";\n background: ", ";\n z-index: 35;\n //transform: scaleY(0);\n height: 0;\n overflow: hidden;\n transform-origin: ", ";\n transition: all 0.2s ease-in-out;\n ", ";\n"])), function (props) {
|
|
40132
40229
|
return props.leftPosition ? 'fixed' : props.relativePosition ? 'relative' : 'absolute';
|
|
40133
40230
|
}, function (props) {
|
|
40134
40231
|
return props.rightSide ? "calc(" + props.leftPosition + " - 250px)" : props.leftPosition || (props.rtlDirection ? '' : props.rightSide ? '' : '5px');
|
|
@@ -40149,7 +40246,7 @@ var Container$j = styled.div(_templateObject$M || (_templateObject$M = _taggedTe
|
|
|
40149
40246
|
}, function (props) {
|
|
40150
40247
|
return props.rendered && "\n height: 225px;\n ";
|
|
40151
40248
|
});
|
|
40152
|
-
var EmojiHeader$1 = styled.div(_templateObject2$
|
|
40249
|
+
var EmojiHeader$1 = styled.div(_templateObject2$I || (_templateObject2$I = _taggedTemplateLiteralLoose(["\n align-items: flex-end;\n font-style: normal;\n font-weight: 500;\n font-size: 12px;\n line-height: 22px;\n text-transform: uppercase;\n color: ", ";\n display: flex;\n padding: ", ";\n"])), function (props) {
|
|
40153
40250
|
return props.color;
|
|
40154
40251
|
}, function (props) {
|
|
40155
40252
|
return props.padding || '6px 18px';
|
|
@@ -40160,7 +40257,7 @@ var EmojiCollection$1 = styled.span(_templateObject4$w || (_templateObject4$w =
|
|
|
40160
40257
|
});
|
|
40161
40258
|
var CollectionPointer$1 = styled.span(_templateObject5$r || (_templateObject5$r = _taggedTemplateLiteralLoose([""])));
|
|
40162
40259
|
var AllEmojis$1 = styled.ul(_templateObject6$n || (_templateObject6$n = _taggedTemplateLiteralLoose(["\n overflow: hidden;\n padding: 0 8px 8px;\n margin: 0;\n"])));
|
|
40163
|
-
var EmojiFooter$1 = styled.div(_templateObject7$
|
|
40260
|
+
var EmojiFooter$1 = styled.div(_templateObject7$m || (_templateObject7$m = _taggedTemplateLiteralLoose(["\n height: 42px;\n display: flex;\n justify-content: space-around;\n align-items: center;\n border-top: ", ";\n border-bottom: ", ";\n padding: 0 10px;\n & > span {\n width: 100%;\n text-align: center;\n }\n"])), function (props) {
|
|
40164
40261
|
return props.emojisCategoryIconsPosition !== 'top' && "1px solid " + props.borderColor;
|
|
40165
40262
|
}, function (props) {
|
|
40166
40263
|
return props.emojisCategoryIconsPosition === 'top' && "1px solid " + props.borderColor;
|
|
@@ -40366,7 +40463,7 @@ function SvgRecordButton(props) {
|
|
|
40366
40463
|
})));
|
|
40367
40464
|
}
|
|
40368
40465
|
|
|
40369
|
-
var _templateObject$
|
|
40466
|
+
var _templateObject$O, _templateObject2$J, _templateObject3$C, _templateObject4$x, _templateObject5$s, _templateObject6$o, _templateObject7$n;
|
|
40370
40467
|
var shouldDraw = false;
|
|
40371
40468
|
var DEFAULT_MAX_RECORDING_DURATION = 600;
|
|
40372
40469
|
var AudioRecord = function AudioRecord(_ref) {
|
|
@@ -40905,7 +41002,7 @@ var AudioRecord = function AudioRecord(_ref) {
|
|
|
40905
41002
|
handleStopRecording();
|
|
40906
41003
|
setCurrentChannelId(channelId);
|
|
40907
41004
|
}, [channelId]);
|
|
40908
|
-
return /*#__PURE__*/React__default.createElement(Container$
|
|
41005
|
+
return /*#__PURE__*/React__default.createElement(Container$l, {
|
|
40909
41006
|
recording: showRecording || currentRecordedFile
|
|
40910
41007
|
}, (showRecording || currentRecordedFile) && (/*#__PURE__*/React__default.createElement(PlayPause$1, {
|
|
40911
41008
|
iconColor: iconPrimary,
|
|
@@ -40944,10 +41041,10 @@ var AudioRecord = function AudioRecord(_ref) {
|
|
|
40944
41041
|
iconColor: accentColor
|
|
40945
41042
|
}, showRecording || currentRecordedFile ? /*#__PURE__*/React__default.createElement(SvgSend, null) : /*#__PURE__*/React__default.createElement(SvgRecordButton, null)));
|
|
40946
41043
|
};
|
|
40947
|
-
var Container$
|
|
41044
|
+
var Container$l = styled.div(_templateObject$O || (_templateObject$O = _taggedTemplateLiteralLoose(["\n width: 32px;\n position: relative;\n display: flex;\n align-items: center;\n justify-content: flex-end;\n ", ";\n transition: all 0.3s ease-in-out;\n"])), function (props) {
|
|
40948
41045
|
return props.recording && "width: 400px";
|
|
40949
41046
|
});
|
|
40950
|
-
var AudioWrapper = styled.div(_templateObject2$
|
|
41047
|
+
var AudioWrapper = styled.div(_templateObject2$J || (_templateObject2$J = _taggedTemplateLiteralLoose(["\n position: relative;\n display: flex;\n align-items: center;\n height: 36px;\n width: ", ";\n overflow: hidden;\n margin: ", ";\n background-color: ", ";\n padding: ", ";\n border-radius: 20px;\n"])), function (props) {
|
|
40951
41048
|
return props.recording ? 'calc(100% - 84px)' : '0';
|
|
40952
41049
|
}, function (props) {
|
|
40953
41050
|
return props.recording ? '0 8px' : '0';
|
|
@@ -40984,14 +41081,14 @@ var Canvas = styled.canvas(_templateObject6$o || (_templateObject6$o = _taggedTe
|
|
|
40984
41081
|
var hide = _ref0.hide;
|
|
40985
41082
|
return hide && '-1';
|
|
40986
41083
|
});
|
|
40987
|
-
var Timer$2 = styled.div(_templateObject7$
|
|
41084
|
+
var Timer$2 = styled.div(_templateObject7$n || (_templateObject7$n = _taggedTemplateLiteralLoose(["\n width: 40px;\n font-weight: 400;\n font-size: 16px;\n line-height: 12px;\n color: ", ";\n margin-left: auto;\n"])), function (props) {
|
|
40988
41085
|
return props.color;
|
|
40989
41086
|
});
|
|
40990
41087
|
|
|
40991
|
-
var _templateObject$
|
|
40992
|
-
var wave = keyframes(_templateObject$
|
|
40993
|
-
var Wrapper = styled.div(_templateObject2$
|
|
40994
|
-
var Bar$
|
|
41088
|
+
var _templateObject$P, _templateObject2$K, _templateObject3$D;
|
|
41089
|
+
var wave = keyframes(_templateObject$P || (_templateObject$P = _taggedTemplateLiteralLoose(["\n 0%, 100% {\n transform: scaleY(0.5);\n opacity: 0.6;\n }\n 50% {\n transform: scaleY(1.2);\n opacity: 1;\n }\n"])));
|
|
41090
|
+
var Wrapper = styled.div(_templateObject2$K || (_templateObject2$K = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: flex-end;\n height: 8px;\n gap: 1.5px;\n"])));
|
|
41091
|
+
var Bar$2 = styled.span(_templateObject3$D || (_templateObject3$D = _taggedTemplateLiteralLoose(["\n display: block;\n width: 3px;\n height: 8px;\n border-radius: 2px;\n background: ", ";\n animation: ", " 1s infinite;\n animation-delay: ", "s;\n"])), function (props) {
|
|
40995
41092
|
return props.borderColor;
|
|
40996
41093
|
}, wave, function (_ref) {
|
|
40997
41094
|
var delay = _ref.delay;
|
|
@@ -40999,19 +41096,19 @@ var Bar$1 = styled.span(_templateObject3$D || (_templateObject3$D = _taggedTempl
|
|
|
40999
41096
|
});
|
|
41000
41097
|
var RecordingAnimation = function RecordingAnimation(_ref2) {
|
|
41001
41098
|
var borderColor = _ref2.borderColor;
|
|
41002
|
-
return /*#__PURE__*/React__default.createElement(Wrapper, null, /*#__PURE__*/React__default.createElement(Bar$
|
|
41099
|
+
return /*#__PURE__*/React__default.createElement(Wrapper, null, /*#__PURE__*/React__default.createElement(Bar$2, {
|
|
41003
41100
|
delay: 0,
|
|
41004
41101
|
borderColor: borderColor
|
|
41005
|
-
}), /*#__PURE__*/React__default.createElement(Bar$
|
|
41102
|
+
}), /*#__PURE__*/React__default.createElement(Bar$2, {
|
|
41006
41103
|
delay: 0.15,
|
|
41007
41104
|
borderColor: borderColor
|
|
41008
|
-
}), /*#__PURE__*/React__default.createElement(Bar$
|
|
41105
|
+
}), /*#__PURE__*/React__default.createElement(Bar$2, {
|
|
41009
41106
|
delay: 0.3,
|
|
41010
41107
|
borderColor: borderColor
|
|
41011
|
-
}), /*#__PURE__*/React__default.createElement(Bar$
|
|
41108
|
+
}), /*#__PURE__*/React__default.createElement(Bar$2, {
|
|
41012
41109
|
delay: 0.45,
|
|
41013
41110
|
borderColor: borderColor
|
|
41014
|
-
}), /*#__PURE__*/React__default.createElement(Bar$
|
|
41111
|
+
}), /*#__PURE__*/React__default.createElement(Bar$2, {
|
|
41015
41112
|
delay: 0.6,
|
|
41016
41113
|
borderColor: borderColor
|
|
41017
41114
|
}));
|
|
@@ -41039,7 +41136,7 @@ function SvgDotsVertica(props) {
|
|
|
41039
41136
|
})));
|
|
41040
41137
|
}
|
|
41041
41138
|
|
|
41042
|
-
var _templateObject$
|
|
41139
|
+
var _templateObject$Q, _templateObject2$L, _templateObject3$E, _templateObject4$y, _templateObject5$t, _templateObject6$p, _templateObject7$o, _templateObject8$l, _templateObject9$i;
|
|
41043
41140
|
var CreatePollPopup = function CreatePollPopup(_ref) {
|
|
41044
41141
|
var togglePopup = _ref.togglePopup,
|
|
41045
41142
|
onCreate = _ref.onCreate;
|
|
@@ -41411,8 +41508,8 @@ var CreatePollPopup = function CreatePollPopup(_ref) {
|
|
|
41411
41508
|
buttonText: 'Discard'
|
|
41412
41509
|
})));
|
|
41413
41510
|
};
|
|
41414
|
-
var QuestionInputWrapper = styled.div(_templateObject$
|
|
41415
|
-
var CustomTextArea = styled.textarea(_templateObject2$
|
|
41511
|
+
var QuestionInputWrapper = styled.div(_templateObject$Q || (_templateObject$Q = _taggedTemplateLiteralLoose(["\n position: relative;\n"])));
|
|
41512
|
+
var CustomTextArea = styled.textarea(_templateObject2$L || (_templateObject2$L = _taggedTemplateLiteralLoose(["\n height: 40px;\n width: 100%;\n background: ", ";\n border: ", ";\n color: ", ";\n box-sizing: border-box;\n border-radius: 8px;\n padding: ", ";\n font-family: Inter, sans-serif;\n font-style: normal;\n font-weight: normal;\n font-size: 15px;\n line-height: 18px;\n opacity: 1;\n outline: none;\n resize: none;\n overflow: hidden;\n\n &:focus {\n border: 1px solid ", ";\n outline: ", ";\n }\n &:disabled {\n background-color: ", ";\n opacity: 1;\n color: #383b51;\n }\n &::placeholder {\n opacity: 1;\n color: ", ";\n }\n"])), function (props) {
|
|
41416
41513
|
return props.backgroundColor;
|
|
41417
41514
|
}, function (props) {
|
|
41418
41515
|
return props.error ? "1px solid " + props.errorColor : "1px solid " + props.borderColor;
|
|
@@ -41447,7 +41544,7 @@ var RemoveOptionIcon = styled(SvgClose)(_templateObject6$p || (_templateObject6$
|
|
|
41447
41544
|
}, function (props) {
|
|
41448
41545
|
return props.disabled ? 0.5 : 1;
|
|
41449
41546
|
});
|
|
41450
|
-
var AddOptionButton = styled.button(_templateObject7$
|
|
41547
|
+
var AddOptionButton = styled.button(_templateObject7$o || (_templateObject7$o = _taggedTemplateLiteralLoose(["\n margin: 16px 0 0 0;\n background: transparent;\n border: none;\n color: ", ";\n cursor: ", ";\n width: 100%;\n text-align: left;\n padding-left: 32px;\n opacity: ", ";\n"])), function (props) {
|
|
41451
41548
|
return props.disabled ? props.disabledColor : props.color;
|
|
41452
41549
|
}, function (props) {
|
|
41453
41550
|
return props.disabled ? 'not-allowed' : 'pointer';
|
|
@@ -41459,7 +41556,7 @@ var SettingItem = styled.div(_templateObject9$i || (_templateObject9$i = _tagged
|
|
|
41459
41556
|
return props.color;
|
|
41460
41557
|
});
|
|
41461
41558
|
|
|
41462
|
-
var _templateObject$
|
|
41559
|
+
var _templateObject$R, _templateObject2$M, _templateObject3$F, _templateObject4$z, _templateObject5$u, _templateObject6$q, _templateObject7$p, _templateObject8$m, _templateObject9$j, _templateObject0$h, _templateObject1$e, _templateObject10$8, _templateObject11$6, _templateObject12$5, _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;
|
|
41463
41560
|
function AutoFocusPlugin(_ref) {
|
|
41464
41561
|
var messageForReply = _ref.messageForReply;
|
|
41465
41562
|
var _useLexicalComposerCo = useLexicalComposerContext(),
|
|
@@ -42780,7 +42877,7 @@ var SendMessageInput = function SendMessageInput(_ref3) {
|
|
|
42780
42877
|
}, [selectedMessagesMap]);
|
|
42781
42878
|
return /*#__PURE__*/React__default.createElement(SendMessageWrapper, {
|
|
42782
42879
|
backgroundColor: backgroundColor || background
|
|
42783
|
-
}, /*#__PURE__*/React__default.createElement(Container$
|
|
42880
|
+
}, /*#__PURE__*/React__default.createElement(Container$m, {
|
|
42784
42881
|
margin: margin,
|
|
42785
42882
|
padding: padding,
|
|
42786
42883
|
border: border,
|
|
@@ -43093,10 +43190,10 @@ var SendMessageInput = function SendMessageInput(_ref3) {
|
|
|
43093
43190
|
maxRecordingDuration: audioRecordingMaxDuration
|
|
43094
43191
|
}))))))))));
|
|
43095
43192
|
};
|
|
43096
|
-
var SendMessageWrapper = styled.div(_templateObject$
|
|
43193
|
+
var SendMessageWrapper = styled.div(_templateObject$R || (_templateObject$R = _taggedTemplateLiteralLoose(["\n background-color: ", ";\n position: relative;\n z-index: 100;\n"])), function (props) {
|
|
43097
43194
|
return props.backgroundColor;
|
|
43098
43195
|
});
|
|
43099
|
-
var Container$
|
|
43196
|
+
var Container$m = styled.div(_templateObject2$M || (_templateObject2$M = _taggedTemplateLiteralLoose(["\n margin: ", ";\n border: ", ";\n border-radius: ", ";\n position: relative;\n padding: ", ";\n z-index: 100;\n\n & span.rdw-suggestion-dropdown {\n position: absolute;\n bottom: 100%;\n height: 160px;\n min-width: 150px;\n display: flex;\n flex-direction: column;\n overflow: auto;\n padding: 6px 12px;\n border: 1px solid #ccc;\n background: #fff;\n z-index: 99;\n }\n\n & .text_formatting_toolbar {\n display: ", ";\n position: fixed;\n top: ", ";\n left: ", ";\n }\n\n & .rdw-suggestion-option-active {\n background-color: rgb(243, 245, 248);\n }\n\n & .custom_editor {\n cursor: text;\n\n & .rdw-mention-link {\n color: ", ";\n }\n }\n"])), function (props) {
|
|
43100
43197
|
return props.margin || '30px 0 16px';
|
|
43101
43198
|
}, function (props) {
|
|
43102
43199
|
return props.border || '';
|
|
@@ -43135,7 +43232,7 @@ var UploadErrorMessage = styled.p(_templateObject5$u || (_templateObject5$u = _t
|
|
|
43135
43232
|
var CloseEditMode = styled.span(_templateObject6$q || (_templateObject6$q = _taggedTemplateLiteralLoose(["\n position: absolute;\n top: 8px;\n right: 12px;\n width: 20px;\n height: 20px;\n text-align: center;\n line-height: 22px;\n cursor: pointer;\n\n & > svg {\n color: ", ";\n }\n"])), function (props) {
|
|
43136
43233
|
return props.color;
|
|
43137
43234
|
});
|
|
43138
|
-
var UserName$1 = styled.span(_templateObject7$
|
|
43235
|
+
var UserName$1 = styled.span(_templateObject7$p || (_templateObject7$p = _taggedTemplateLiteralLoose(["\n font-weight: 500;\n margin-left: 4px;\n"])));
|
|
43139
43236
|
var ReplyMessageBody$1 = styled.div(_templateObject8$m || (_templateObject8$m = _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"])));
|
|
43140
43237
|
var EditReplyMessageHeader = styled.h4(_templateObject9$j || (_templateObject9$j = _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) {
|
|
43141
43238
|
return props.color;
|
|
@@ -43480,7 +43577,7 @@ function SvgUnpin(props) {
|
|
|
43480
43577
|
})));
|
|
43481
43578
|
}
|
|
43482
43579
|
|
|
43483
|
-
var _templateObject$
|
|
43580
|
+
var _templateObject$S, _templateObject2$N, _templateObject3$G, _templateObject4$A, _templateObject5$v, _templateObject6$r, _templateObject7$q, _templateObject8$n, _templateObject9$k, _templateObject0$i, _templateObject1$f, _templateObject10$9, _templateObject11$7, _templateObject12$6, _templateObject13$4, _templateObject14$3, _templateObject15$3, _templateObject16$3;
|
|
43484
43581
|
var Actions = function Actions(_ref) {
|
|
43485
43582
|
var setActionsHeight = _ref.setActionsHeight,
|
|
43486
43583
|
channel = _ref.channel,
|
|
@@ -43690,7 +43787,7 @@ var Actions = function Actions(_ref) {
|
|
|
43690
43787
|
setActionsHeight && setActionsHeight(containerRef.current.offsetHeight);
|
|
43691
43788
|
}
|
|
43692
43789
|
}, [containerRef.current, showMuteUnmuteNotifications, showStarredMessages, showPinChannel, showMarkAsReadUnread, showLeaveChannel, showBlockAndLeaveChannel, showBlockUser, showReportChannel, showDeleteChannel, showClearHistory]);
|
|
43693
|
-
return /*#__PURE__*/React__default.createElement(Container$
|
|
43790
|
+
return /*#__PURE__*/React__default.createElement(Container$n, {
|
|
43694
43791
|
isDirect: isDirectChannel,
|
|
43695
43792
|
theme: theme,
|
|
43696
43793
|
borderColor: borderColor || surface1,
|
|
@@ -43944,17 +44041,17 @@ var Actions = function Actions(_ref) {
|
|
|
43944
44041
|
title: popupTitle
|
|
43945
44042
|
})));
|
|
43946
44043
|
};
|
|
43947
|
-
var Container$
|
|
44044
|
+
var Container$n = styled.div(_templateObject$S || (_templateObject$S = _taggedTemplateLiteralLoose(["\n padding: 10px 16px;\n border-bottom: 6px solid ", ";\n]"])), function (props) {
|
|
43948
44045
|
return props.borderColor;
|
|
43949
44046
|
});
|
|
43950
|
-
var ActionHeader = styled.div(_templateObject2$
|
|
44047
|
+
var ActionHeader = styled.div(_templateObject2$N || (_templateObject2$N = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n justify-content: space-between;\n margin: 25px 0 22px;\n cursor: pointer;\n"])));
|
|
43951
44048
|
var MenuTriggerIcon = styled.span(_templateObject3$G || (_templateObject3$G = _taggedTemplateLiteralLoose(["\n transition: all 0.2s;\n ", "\n"])), function (props) {
|
|
43952
44049
|
return !props.isOpen && ' transform: rotate(-90deg);';
|
|
43953
44050
|
});
|
|
43954
44051
|
var ActionsMenu = styled.ul(_templateObject4$A || (_templateObject4$A = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n margin: 0;\n padding: 0;\n list-style: none;\n transition: all 0.2s;\n"])));
|
|
43955
44052
|
var DefaultMutedIcon = styled(SvgUnmuteNotifications)(_templateObject5$v || (_templateObject5$v = _taggedTemplateLiteralLoose([""])));
|
|
43956
44053
|
var DefaultMuteIcon = styled(SvgNotifications)(_templateObject6$r || (_templateObject6$r = _taggedTemplateLiteralLoose([""])));
|
|
43957
|
-
var DefaultStarIcon = styled(SvgStar)(_templateObject7$
|
|
44054
|
+
var DefaultStarIcon = styled(SvgStar)(_templateObject7$q || (_templateObject7$q = _taggedTemplateLiteralLoose([""])));
|
|
43958
44055
|
var DefaultUnpinIcon = styled(SvgUnpin)(_templateObject8$n || (_templateObject8$n = _taggedTemplateLiteralLoose([""])));
|
|
43959
44056
|
var DefaultPinIcon = styled(SvgPin)(_templateObject9$k || (_templateObject9$k = _taggedTemplateLiteralLoose([""])));
|
|
43960
44057
|
var DefaultMarkAsRead = styled(SvgMarkAsRead)(_templateObject0$i || (_templateObject0$i = _taggedTemplateLiteralLoose([""])));
|
|
@@ -44038,7 +44135,7 @@ function SvgMoreVert(props) {
|
|
|
44038
44135
|
})));
|
|
44039
44136
|
}
|
|
44040
44137
|
|
|
44041
|
-
var _templateObject$
|
|
44138
|
+
var _templateObject$T, _templateObject2$O, _templateObject3$H;
|
|
44042
44139
|
var ChangeMemberRole = function ChangeMemberRole(_ref) {
|
|
44043
44140
|
var theme = _ref.theme,
|
|
44044
44141
|
channelId = _ref.channelId,
|
|
@@ -44138,8 +44235,8 @@ var ChangeMemberRole = function ChangeMemberRole(_ref) {
|
|
|
44138
44235
|
onClick: handleSave
|
|
44139
44236
|
}, "Save"))));
|
|
44140
44237
|
};
|
|
44141
|
-
var RolesSelect = styled.div(_templateObject$
|
|
44142
|
-
var RoleLabel = styled.div(_templateObject2$
|
|
44238
|
+
var RolesSelect = styled.div(_templateObject$T || (_templateObject$T = _taggedTemplateLiteralLoose(["\n margin-bottom: 32px;\n"])));
|
|
44239
|
+
var RoleLabel = styled.div(_templateObject2$O || (_templateObject2$O = _taggedTemplateLiteralLoose(["\n font-style: normal;\n font-weight: 500;\n font-size: 14px;\n margin: 20px 0 8px;\n color: ", ";\n"])), function (_ref2) {
|
|
44143
44240
|
var color = _ref2.color;
|
|
44144
44241
|
return color;
|
|
44145
44242
|
});
|
|
@@ -44180,7 +44277,7 @@ function ResetLinkConfirmModal(_ref) {
|
|
|
44180
44277
|
});
|
|
44181
44278
|
}
|
|
44182
44279
|
|
|
44183
|
-
var _templateObject$
|
|
44280
|
+
var _templateObject$U, _templateObject2$P, _templateObject3$I, _templateObject4$B, _templateObject5$w, _templateObject6$s, _templateObject7$r, _templateObject8$o, _templateObject9$l, _templateObject0$j, _templateObject1$g, _templateObject10$a, _templateObject11$8, _templateObject12$7, _templateObject13$5;
|
|
44184
44281
|
function InviteLinkModal(_ref) {
|
|
44185
44282
|
var _getInviteLinkOptions, _tabs$link, _tabs$qr, _tabs$link2, _tabs$qr2;
|
|
44186
44283
|
var onClose = _ref.onClose,
|
|
@@ -44664,8 +44761,8 @@ function InviteLinkModal(_ref) {
|
|
|
44664
44761
|
handleForward: handleForwardChannels
|
|
44665
44762
|
})));
|
|
44666
44763
|
}
|
|
44667
|
-
var LogoIconCont = styled.div(_templateObject$
|
|
44668
|
-
var Tabs$1 = styled.div(_templateObject2$
|
|
44764
|
+
var LogoIconCont = styled.div(_templateObject$U || (_templateObject$U = _taggedTemplateLiteralLoose(["\n position: absolute;\n top: calc(50% - 11%);\n left: calc(50% - 11%);\n width: 22%;\n height: 22%;\n img {\n width: 100%;\n height: 100%;\n object-fit: contain;\n border-radius: 10px;\n }\n svg {\n width: 100%;\n height: 100%;\n object-fit: contain;\n border-radius: 10px;\n }\n"])));
|
|
44765
|
+
var Tabs$1 = styled.div(_templateObject2$P || (_templateObject2$P = _taggedTemplateLiteralLoose(["\n display: grid;\n grid-template-columns: 1fr 1fr;\n gap: 8px;\n border-radius: 10px;\n background-color: ", ";\n padding: 2px;\n margin: 4px 0 16px;\n border: 1px solid ", ";\n"])), function (p) {
|
|
44669
44766
|
return p.backgroundColor;
|
|
44670
44767
|
}, function (p) {
|
|
44671
44768
|
return p.borderColor;
|
|
@@ -44688,7 +44785,7 @@ var LinkField = styled.div(_templateObject6$s || (_templateObject6$s = _taggedTe
|
|
|
44688
44785
|
}, function (p) {
|
|
44689
44786
|
return p.backgroundColor;
|
|
44690
44787
|
});
|
|
44691
|
-
var LinkInput = styled.input(_templateObject7$
|
|
44788
|
+
var LinkInput = styled.input(_templateObject7$r || (_templateObject7$r = _taggedTemplateLiteralLoose(["\n flex: 1;\n border: none;\n outline: none;\n height: 40px;\n background: transparent;\n color: ", ";\n font-size: 14px;\n"])), function (p) {
|
|
44692
44789
|
return p.color;
|
|
44693
44790
|
});
|
|
44694
44791
|
var CopyButton = styled.button(_templateObject8$o || (_templateObject8$o = _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"])));
|
|
@@ -44712,7 +44809,7 @@ var QrHint = styled.p(_templateObject13$5 || (_templateObject13$5 = _taggedTempl
|
|
|
44712
44809
|
return p.color;
|
|
44713
44810
|
});
|
|
44714
44811
|
|
|
44715
|
-
var _templateObject$
|
|
44812
|
+
var _templateObject$V, _templateObject2$Q, _templateObject3$J, _templateObject4$C, _templateObject5$x, _templateObject6$t, _templateObject7$s, _templateObject8$p, _templateObject9$m;
|
|
44716
44813
|
var Members = function Members(_ref) {
|
|
44717
44814
|
var _members$find;
|
|
44718
44815
|
var channel = _ref.channel,
|
|
@@ -44888,7 +44985,7 @@ var Members = function Members(_ref) {
|
|
|
44888
44985
|
var currentUserRole = (_members$find = members.find(function (member) {
|
|
44889
44986
|
return member.id === user.id;
|
|
44890
44987
|
})) === null || _members$find === void 0 ? void 0 : _members$find.role;
|
|
44891
|
-
return /*#__PURE__*/React__default.createElement(Container$
|
|
44988
|
+
return /*#__PURE__*/React__default.createElement(Container$o, {
|
|
44892
44989
|
theme: theme
|
|
44893
44990
|
}, /*#__PURE__*/React__default.createElement(ActionsMenu$1, null, /*#__PURE__*/React__default.createElement(MembersList, {
|
|
44894
44991
|
onScroll: handleMembersListScroll
|
|
@@ -45034,8 +45131,8 @@ var Members = function Members(_ref) {
|
|
|
45034
45131
|
channelId: channel.id
|
|
45035
45132
|
})));
|
|
45036
45133
|
};
|
|
45037
|
-
var Container$
|
|
45038
|
-
var ActionsMenu$1 = styled.div(_templateObject2$
|
|
45134
|
+
var Container$o = styled.div(_templateObject$V || (_templateObject$V = _taggedTemplateLiteralLoose([""])));
|
|
45135
|
+
var ActionsMenu$1 = styled.div(_templateObject2$Q || (_templateObject2$Q = _taggedTemplateLiteralLoose(["\n position: relative;\n transition: all 0.2s;\n"])));
|
|
45039
45136
|
var MemberNamePresence = styled.div(_templateObject3$J || (_templateObject3$J = _taggedTemplateLiteralLoose(["\n margin-left: 12px;\n max-width: calc(100% - 84px);\n\n & > ", " {\n display: block;\n }\n"])), SubTitle);
|
|
45040
45137
|
var MemberNameWrapper = styled.div(_templateObject4$C || (_templateObject4$C = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n"])));
|
|
45041
45138
|
var MemberName$3 = styled.h4(_templateObject5$x || (_templateObject5$x = _taggedTemplateLiteralLoose(["\n margin: 0;\n font-weight: 400;\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden;\n color: ", ";\n"])), function (props) {
|
|
@@ -45044,7 +45141,7 @@ var MemberName$3 = styled.h4(_templateObject5$x || (_templateObject5$x = _tagged
|
|
|
45044
45141
|
var EditMemberIcon = styled.span(_templateObject6$t || (_templateObject6$t = _taggedTemplateLiteralLoose(["\n margin-left: auto;\n cursor: pointer;\n padding: 15px;\n opacity: 0;\n visibility: hidden;\n transition: all 0.2s;\n\n & svg {\n color: ", ";\n }\n"])), function (props) {
|
|
45045
45142
|
return props.color;
|
|
45046
45143
|
});
|
|
45047
|
-
var MembersList = styled.ul(_templateObject7$
|
|
45144
|
+
var MembersList = styled.ul(_templateObject7$s || (_templateObject7$s = _taggedTemplateLiteralLoose(["\n margin: 0;\n padding: 0;\n list-style: none;\n transition: all 0.2s;\n"])));
|
|
45048
45145
|
var MemberItem$1 = styled.li(_templateObject8$p || (_templateObject8$p = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n font-size: ", ";\n font-weight: 500;\n padding: 6px 16px;\n transition: all 0.2s;\n color: ", ";\n cursor: pointer;\n\n & > svg {\n rect {\n fill: transparent;\n }\n }\n\n &:first-child {\n cursor: pointer;\n\n > svg {\n color: ", ";\n margin-right: 12px;\n & > rect {\n fill: ", " !important;\n }\n }\n }\n\n &:hover {\n background-color: ", ";\n }\n\n &:hover ", " {\n opacity: 1;\n visibility: visible;\n }\n\n & .dropdown-wrapper {\n margin-left: auto;\n }\n\n & ", " {\n width: 12px;\n height: 12px;\n right: -1px;\n bottom: -1px;\n }\n"])), function (props) {
|
|
45049
45146
|
return props.fontSize || '15px';
|
|
45050
45147
|
}, function (props) {
|
|
@@ -45062,7 +45159,7 @@ var RoleBadge = styled.span(_templateObject9$m || (_templateObject9$m = _taggedT
|
|
|
45062
45159
|
return props.backgroundColor;
|
|
45063
45160
|
});
|
|
45064
45161
|
|
|
45065
|
-
var _templateObject$
|
|
45162
|
+
var _templateObject$W, _templateObject2$R;
|
|
45066
45163
|
var Media = function Media(_ref) {
|
|
45067
45164
|
var channel = _ref.channel;
|
|
45068
45165
|
var _useColor = useColors(),
|
|
@@ -45079,7 +45176,7 @@ var Media = function Media(_ref) {
|
|
|
45079
45176
|
dispatch(setAttachmentsAC([]));
|
|
45080
45177
|
dispatch(getAttachmentsAC(channel.id, channelDetailsTabs.media));
|
|
45081
45178
|
}, [channel.id]);
|
|
45082
|
-
return /*#__PURE__*/React__default.createElement(Container$
|
|
45179
|
+
return /*#__PURE__*/React__default.createElement(Container$p, null, attachments.map(function (file) {
|
|
45083
45180
|
return /*#__PURE__*/React__default.createElement(MediaItem, {
|
|
45084
45181
|
key: file.id
|
|
45085
45182
|
}, file.type === 'image' ? (/*#__PURE__*/React__default.createElement(Attachment$1, {
|
|
@@ -45108,8 +45205,8 @@ var Media = function Media(_ref) {
|
|
|
45108
45205
|
currentMediaFile: mediaFile
|
|
45109
45206
|
})));
|
|
45110
45207
|
};
|
|
45111
|
-
var Container$
|
|
45112
|
-
var MediaItem = styled.div(_templateObject2$
|
|
45208
|
+
var Container$p = styled.div(_templateObject$W || (_templateObject$W = _taggedTemplateLiteralLoose(["\n padding: 6px 4px;\n overflow-x: hidden;\n overflow-y: auto;\n list-style: none;\n transition: all 0.2s;\n align-items: flex-start;\n display: flex;\n flex-wrap: wrap;\n"])));
|
|
45209
|
+
var MediaItem = styled.div(_templateObject2$R || (_templateObject2$R = _taggedTemplateLiteralLoose(["\n width: calc(33.3333% - 4px);\n aspect-ratio: 1/1;\n box-sizing: border-box;\n //border: 1px solid #ccc;\n border: 0.5px solid rgba(0, 0, 0, 0.1);\n border-radius: 8px;\n overflow: hidden;\n margin: 2px;\n"])));
|
|
45113
45210
|
|
|
45114
45211
|
var _rect$3, _path$1u;
|
|
45115
45212
|
function _extends$1y() {
|
|
@@ -45165,7 +45262,7 @@ function SvgDownloadFile(props) {
|
|
|
45165
45262
|
})));
|
|
45166
45263
|
}
|
|
45167
45264
|
|
|
45168
|
-
var _templateObject$
|
|
45265
|
+
var _templateObject$X, _templateObject2$S, _templateObject3$K, _templateObject4$D, _templateObject5$y, _templateObject6$u, _templateObject7$t, _templateObject8$q;
|
|
45169
45266
|
var Files = function Files(_ref) {
|
|
45170
45267
|
var channelId = _ref.channelId,
|
|
45171
45268
|
filePreviewIcon = _ref.filePreviewIcon,
|
|
@@ -45220,7 +45317,7 @@ var Files = function Files(_ref) {
|
|
|
45220
45317
|
useEffect(function () {
|
|
45221
45318
|
dispatch(getAttachmentsAC(channelId, channelDetailsTabs.file));
|
|
45222
45319
|
}, [channelId]);
|
|
45223
|
-
return /*#__PURE__*/React__default.createElement(Container$
|
|
45320
|
+
return /*#__PURE__*/React__default.createElement(Container$q, null, attachments.map(function (file) {
|
|
45224
45321
|
var metas = file.metadata && isJSON(file.metadata) ? JSON.parse(file.metadata) : file.metadata;
|
|
45225
45322
|
var withPrefix = true;
|
|
45226
45323
|
var attachmentThumb = '';
|
|
@@ -45281,8 +45378,8 @@ var Files = function Files(_ref) {
|
|
|
45281
45378
|
}))) : filePreviewDownloadIcon || /*#__PURE__*/React__default.createElement(SvgDownloadFile, null)));
|
|
45282
45379
|
}));
|
|
45283
45380
|
};
|
|
45284
|
-
var Container$
|
|
45285
|
-
var DownloadWrapper = styled.a(_templateObject2$
|
|
45381
|
+
var Container$q = styled.ul(_templateObject$X || (_templateObject$X = _taggedTemplateLiteralLoose(["\n margin: 0;\n padding: 0;\n overflow-x: hidden;\n overflow-y: auto;\n list-style: none;\n transition: all 0.2s;\n"])));
|
|
45382
|
+
var DownloadWrapper = styled.a(_templateObject2$S || (_templateObject2$S = _taggedTemplateLiteralLoose(["\n text-decoration: none;\n visibility: ", ";\n padding: 5px 6px;\n position: absolute;\n top: 25%;\n right: 16px;\n cursor: pointer;\n & > svg {\n & path {\n fill: ", ";\n }\n color: ", ";\n }\n"])), function (props) {
|
|
45286
45383
|
return props.visible ? 'visible' : 'hidden';
|
|
45287
45384
|
}, function (props) {
|
|
45288
45385
|
return props.iconColor;
|
|
@@ -45301,7 +45398,7 @@ var FileHoverIconCont = styled.span(_templateObject5$y || (_templateObject5$y =
|
|
|
45301
45398
|
return props.fillColor;
|
|
45302
45399
|
});
|
|
45303
45400
|
var FileThumb = styled.img(_templateObject6$u || (_templateObject6$u = _taggedTemplateLiteralLoose(["\n width: 40px;\n height: 40px;\n border: 0.5px solid rgba(0, 0, 0, 0.1);\n border-radius: 8px;\n object-fit: cover;\n"])));
|
|
45304
|
-
var FileItem = styled.div(_templateObject7$
|
|
45401
|
+
var FileItem = styled.div(_templateObject7$t || (_templateObject7$t = _taggedTemplateLiteralLoose(["\n position: relative;\n padding: 11px 16px;\n display: flex;\n align-items: center;\n font-size: 15px;\n transition: all 0.2s;\n div {\n margin-left: 7px;\n width: calc(100% - 48px);\n }\n &:hover {\n background-color: ", ";\n ", " {\n visibility: visible;\n }\n & ", " {\n display: none;\n }\n & ", " {\n display: inline-flex;\n }\n }\n /*&.isHover {\n\n }*/\n"])), function (props) {
|
|
45305
45402
|
return props.hoverBackgroundColor;
|
|
45306
45403
|
}, DownloadWrapper, FileIconCont, FileHoverIconCont);
|
|
45307
45404
|
var FileSizeAndDate = styled.span(_templateObject8$q || (_templateObject8$q = _taggedTemplateLiteralLoose(["\n display: block;\n font-style: normal;\n font-weight: normal;\n font-size: ", ";\n line-height: ", ";\n color: ", ";\n margin-top: 2px;\n"])), function (props) {
|
|
@@ -45343,7 +45440,7 @@ function SvgLinkIcon(props) {
|
|
|
45343
45440
|
})));
|
|
45344
45441
|
}
|
|
45345
45442
|
|
|
45346
|
-
var _templateObject$
|
|
45443
|
+
var _templateObject$Y, _templateObject2$T, _templateObject3$L, _templateObject4$E, _templateObject5$z;
|
|
45347
45444
|
var LinkItem = function LinkItem(_ref) {
|
|
45348
45445
|
var link = _ref.link,
|
|
45349
45446
|
linkPreviewIcon = _ref.linkPreviewIcon,
|
|
@@ -45374,12 +45471,12 @@ var LinkItem = function LinkItem(_ref) {
|
|
|
45374
45471
|
color: linkPreviewColor || textPrimary
|
|
45375
45472
|
}, link))));
|
|
45376
45473
|
};
|
|
45377
|
-
var LinkIconCont = styled.span(_templateObject$
|
|
45474
|
+
var LinkIconCont = styled.span(_templateObject$Y || (_templateObject$Y = _taggedTemplateLiteralLoose(["\n display: inline-flex;\n > svg {\n color: ", ";\n fill: ", ";\n }\n"])), function (props) {
|
|
45378
45475
|
return props.iconColor;
|
|
45379
45476
|
}, function (props) {
|
|
45380
45477
|
return props.fillColor;
|
|
45381
45478
|
});
|
|
45382
|
-
var LinkHoverIconCont = styled.span(_templateObject2$
|
|
45479
|
+
var LinkHoverIconCont = styled.span(_templateObject2$T || (_templateObject2$T = _taggedTemplateLiteralLoose(["\n display: none;\n > svg {\n color: ", ";\n fill: ", ";\n }\n"])), function (props) {
|
|
45383
45480
|
return props.iconColor;
|
|
45384
45481
|
}, function (props) {
|
|
45385
45482
|
return props.fillColor;
|
|
@@ -45392,7 +45489,7 @@ var LinkUrl = styled.span(_templateObject5$z || (_templateObject5$z = _taggedTem
|
|
|
45392
45489
|
return props.color;
|
|
45393
45490
|
});
|
|
45394
45491
|
|
|
45395
|
-
var _templateObject$
|
|
45492
|
+
var _templateObject$Z;
|
|
45396
45493
|
var Links = function Links(_ref) {
|
|
45397
45494
|
var channelId = _ref.channelId,
|
|
45398
45495
|
linkPreviewIcon = _ref.linkPreviewIcon,
|
|
@@ -45405,7 +45502,7 @@ var Links = function Links(_ref) {
|
|
|
45405
45502
|
useEffect(function () {
|
|
45406
45503
|
dispatch(getAttachmentsAC(channelId, channelDetailsTabs.link));
|
|
45407
45504
|
}, [channelId]);
|
|
45408
|
-
return /*#__PURE__*/React__default.createElement(Container$
|
|
45505
|
+
return /*#__PURE__*/React__default.createElement(Container$r, null, attachments.map(function (file) {
|
|
45409
45506
|
return /*#__PURE__*/React__default.createElement(LinkItem, {
|
|
45410
45507
|
key: file.id,
|
|
45411
45508
|
link: file.url,
|
|
@@ -45417,7 +45514,7 @@ var Links = function Links(_ref) {
|
|
|
45417
45514
|
});
|
|
45418
45515
|
}));
|
|
45419
45516
|
};
|
|
45420
|
-
var Container$
|
|
45517
|
+
var Container$r = styled.ul(_templateObject$Z || (_templateObject$Z = _taggedTemplateLiteralLoose(["\n margin: 0;\n padding: 11px 0 0;\n overflow-x: hidden;\n overflow-y: auto;\n list-style: none;\n transition: all 0.2s;\n"])));
|
|
45421
45518
|
|
|
45422
45519
|
var _rect$5, _path$1x;
|
|
45423
45520
|
function _extends$1B() {
|
|
@@ -45473,7 +45570,7 @@ function SvgVoicePreviewPause(props) {
|
|
|
45473
45570
|
})));
|
|
45474
45571
|
}
|
|
45475
45572
|
|
|
45476
|
-
var _templateObject$
|
|
45573
|
+
var _templateObject$_, _templateObject2$U, _templateObject3$M, _templateObject4$F, _templateObject5$A, _templateObject6$v, _templateObject7$u, _templateObject8$r;
|
|
45477
45574
|
var VoiceItem = function VoiceItem(_ref) {
|
|
45478
45575
|
var file = _ref.file,
|
|
45479
45576
|
voicePreviewPlayIcon = _ref.voicePreviewPlayIcon,
|
|
@@ -45598,12 +45695,12 @@ var VoiceItem = function VoiceItem(_ref) {
|
|
|
45598
45695
|
type: 'audio/mpeg'
|
|
45599
45696
|
})));
|
|
45600
45697
|
};
|
|
45601
|
-
var FileIconCont$1 = styled.span(_templateObject$
|
|
45698
|
+
var FileIconCont$1 = styled.span(_templateObject$_ || (_templateObject$_ = _taggedTemplateLiteralLoose(["\n cursor: pointer;\n display: inline-flex;\n fill: ", ";\n rect {\n fill: ", ";\n }\n"])), function (props) {
|
|
45602
45699
|
return props.fill || 'transparent';
|
|
45603
45700
|
}, function (props) {
|
|
45604
45701
|
return props.fill || 'transparent';
|
|
45605
45702
|
});
|
|
45606
|
-
var FileHoverIconCont$1 = styled.span(_templateObject2$
|
|
45703
|
+
var FileHoverIconCont$1 = styled.span(_templateObject2$U || (_templateObject2$U = _taggedTemplateLiteralLoose(["\n cursor: pointer;\n display: none;\n fill: ", ";\n rect {\n fill: ", ";\n }\n"])), function (props) {
|
|
45607
45704
|
return props.fill || 'transparent';
|
|
45608
45705
|
}, function (props) {
|
|
45609
45706
|
return props.fill || 'transparent';
|
|
@@ -45618,12 +45715,12 @@ var AudioTitle = styled.span(_templateObject5$A || (_templateObject5$A = _tagged
|
|
|
45618
45715
|
var AudioDate = styled.span(_templateObject6$v || (_templateObject6$v = _taggedTemplateLiteralLoose(["\n display: block;\n overflow: hidden;\n white-space: nowrap;\n text-overflow: ellipsis;\n max-width: calc(100% - 72px);\n font-style: normal;\n font-weight: normal;\n font-size: 13px;\n line-height: 16px;\n color: ", ";\n"])), function (props) {
|
|
45619
45716
|
return props.color;
|
|
45620
45717
|
});
|
|
45621
|
-
var AudioSendTime = styled.span(_templateObject7$
|
|
45718
|
+
var AudioSendTime = styled.span(_templateObject7$u || (_templateObject7$u = _taggedTemplateLiteralLoose(["\n position: absolute;\n right: 0;\n top: 11px;\n color: ", ";\n font-size: 12px;\n line-height: 16px;\n"])), function (props) {
|
|
45622
45719
|
return props.color;
|
|
45623
45720
|
});
|
|
45624
45721
|
var Audio = styled.audio(_templateObject8$r || (_templateObject8$r = _taggedTemplateLiteralLoose(["\n display: none;\n"])));
|
|
45625
45722
|
|
|
45626
|
-
var _templateObject
|
|
45723
|
+
var _templateObject$$;
|
|
45627
45724
|
var Voices = function Voices(_ref) {
|
|
45628
45725
|
var channelId = _ref.channelId,
|
|
45629
45726
|
voicePreviewPlayIcon = _ref.voicePreviewPlayIcon,
|
|
@@ -45638,7 +45735,7 @@ var Voices = function Voices(_ref) {
|
|
|
45638
45735
|
useEffect(function () {
|
|
45639
45736
|
dispatch(getAttachmentsAC(channelId, channelDetailsTabs.voice));
|
|
45640
45737
|
}, [channelId]);
|
|
45641
|
-
return /*#__PURE__*/React__default.createElement(Container$
|
|
45738
|
+
return /*#__PURE__*/React__default.createElement(Container$s, null, attachments.map(function (file) {
|
|
45642
45739
|
return /*#__PURE__*/React__default.createElement(VoiceItem, {
|
|
45643
45740
|
key: file.id,
|
|
45644
45741
|
file: _extends({}, file, {
|
|
@@ -45654,9 +45751,9 @@ var Voices = function Voices(_ref) {
|
|
|
45654
45751
|
});
|
|
45655
45752
|
}));
|
|
45656
45753
|
};
|
|
45657
|
-
var Container$
|
|
45754
|
+
var Container$s = styled.ul(_templateObject$$ || (_templateObject$$ = _taggedTemplateLiteralLoose(["\n margin: 0;\n padding: 11px 0 0;\n overflow-x: hidden;\n overflow-y: auto;\n list-style: none;\n transition: all 0.2s;\n"])));
|
|
45658
45755
|
|
|
45659
|
-
var _templateObject
|
|
45756
|
+
var _templateObject$10, _templateObject2$V;
|
|
45660
45757
|
var DetailsTab = function DetailsTab(_ref) {
|
|
45661
45758
|
var channel = _ref.channel,
|
|
45662
45759
|
theme = _ref.theme,
|
|
@@ -45725,7 +45822,7 @@ var DetailsTab = function DetailsTab(_ref) {
|
|
|
45725
45822
|
setActiveTab(channelDetailsTabs.member);
|
|
45726
45823
|
}
|
|
45727
45824
|
}, [showMembers]);
|
|
45728
|
-
return /*#__PURE__*/React__default.createElement(Container$
|
|
45825
|
+
return /*#__PURE__*/React__default.createElement(Container$t, {
|
|
45729
45826
|
theme: theme
|
|
45730
45827
|
}, /*#__PURE__*/React__default.createElement(DetailsTabHeader, {
|
|
45731
45828
|
color: textSecondary,
|
|
@@ -45807,8 +45904,8 @@ var DetailsTab = function DetailsTab(_ref) {
|
|
|
45807
45904
|
voicePreviewHoverBackgroundColor: voicePreviewHoverBackgroundColor
|
|
45808
45905
|
})));
|
|
45809
45906
|
};
|
|
45810
|
-
var Container$
|
|
45811
|
-
var DetailsTabHeader = styled.div(_templateObject2$
|
|
45907
|
+
var Container$t = styled.div(_templateObject$10 || (_templateObject$10 = _taggedTemplateLiteralLoose(["\n min-height: calc(100vh - 64px);\n"])));
|
|
45908
|
+
var DetailsTabHeader = styled.div(_templateObject2$V || (_templateObject2$V = _taggedTemplateLiteralLoose(["\n overflow-x: auto;\n overflow-y: hidden;\n border-bottom: 1px solid ", ";\n background-color: ", ";\n display: flex;\n justify-content: space-between;\n position: sticky;\n top: 0;\n z-index: 12;\n /* width */\n &::-webkit-scrollbar {\n width: 0;\n height: 0;\n }\n\n /* Track */\n &::-webkit-scrollbar-track {\n background: transparent;\n }\n\n /* Handle */\n &::-webkit-scrollbar-thumb {\n background: transparent;\n }\n\n /* Handle on hover */\n &::-webkit-scrollbar-thumb:hover {\n background: transparent;\n }\n button {\n position: relative;\n border: none;\n background: transparent;\n outline: none;\n height: 44px;\n text-transform: capitalize;\n font-style: normal;\n font-weight: 500;\n font-size: ", ";\n line-height: ", ";\n color: ", ";\n min-width: ", ";\n cursor: pointer;\n }\n\n & span {\n position: relative;\n display: inline-flex;\n align-items: center;\n height: 100%;\n }\n\n & .active span {\n color: ", ";\n\n &:after {\n content: '';\n width: 100%;\n border-radius: 2px;\n height: 2px;\n background-color: ", ";\n position: absolute;\n top: calc(100% - 1px);\n left: 0;\n }\n }\n"])), function (props) {
|
|
45812
45909
|
return props.borderColor;
|
|
45813
45910
|
}, function (props) {
|
|
45814
45911
|
return props.backgroundColor || 'transparent';
|
|
@@ -45826,15 +45923,15 @@ var DetailsTabHeader = styled.div(_templateObject2$U || (_templateObject2$U = _t
|
|
|
45826
45923
|
return props.activeTabColor;
|
|
45827
45924
|
});
|
|
45828
45925
|
|
|
45829
|
-
var _templateObject$
|
|
45830
|
-
var Container$
|
|
45926
|
+
var _templateObject$11, _templateObject2$W, _templateObject3$N, _templateObject4$G;
|
|
45927
|
+
var Container$u = styled.div(_templateObject$11 || (_templateObject$11 = _taggedTemplateLiteralLoose(["\n ", ";\n height: ", ";\n position: absolute;\n padding: 24px 16px;\n background-color: ", ";\n z-index: 25;\n"])), function (props) {
|
|
45831
45928
|
return props.active ? 'display: block' : 'display: none';
|
|
45832
45929
|
}, function (props) {
|
|
45833
45930
|
return "calc(100vh - " + (props.heightOffset ? props.heightOffset + 48 : 48) + "px)";
|
|
45834
45931
|
}, function (props) {
|
|
45835
45932
|
return props.backgroundColor;
|
|
45836
45933
|
});
|
|
45837
|
-
var AvatarCont = styled.div(_templateObject2$
|
|
45934
|
+
var AvatarCont = styled.div(_templateObject2$W || (_templateObject2$W = _taggedTemplateLiteralLoose(["\n display: flex;\n justify-content: center;\n align-items: center;\n position: relative;\n margin-bottom: 4px;\n\n &::after {\n content: '';\n position: absolute;\n width: 120px;\n height: 120px;\n border-radius: 50%;\n background-color: rgba(0, 0, 0, 0.4);\n }\n .dropdown-body {\n top: inherit;\n right: inherit;\n bottom: -90px;\n }\n"])));
|
|
45838
45935
|
var DropDownWrapper = styled.div(_templateObject3$N || (_templateObject3$N = _taggedTemplateLiteralLoose(["\n position: absolute;\n z-index: 4;\n width: 40px;\n height: 40px;\n"])));
|
|
45839
45936
|
var EditChannelFooter = styled(ButtonBlock)(_templateObject4$G || (_templateObject4$G = _taggedTemplateLiteralLoose(["\n margin-top: 24px;\n\n & > button {\n margin-left: 12px;\n }\n"])));
|
|
45840
45937
|
var EditChannel = function EditChannel(_ref) {
|
|
@@ -45988,7 +46085,7 @@ var EditChannel = function EditChannel(_ref) {
|
|
|
45988
46085
|
useEffect(function () {
|
|
45989
46086
|
setOffsetTop(editContainer && editContainer.current && editContainer.current.offsetTop);
|
|
45990
46087
|
}, []);
|
|
45991
|
-
return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(Container$
|
|
46088
|
+
return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(Container$u, {
|
|
45992
46089
|
ref: editContainer,
|
|
45993
46090
|
heightOffset: offsetTop,
|
|
45994
46091
|
active: isEditMode,
|
|
@@ -46091,7 +46188,7 @@ var EditChannel = function EditChannel(_ref) {
|
|
|
46091
46188
|
})));
|
|
46092
46189
|
};
|
|
46093
46190
|
|
|
46094
|
-
var _templateObject$
|
|
46191
|
+
var _templateObject$12, _templateObject2$X, _templateObject3$O, _templateObject4$H, _templateObject5$B, _templateObject6$w, _templateObject7$v, _templateObject8$s, _templateObject9$n, _templateObject0$k, _templateObject1$h, _templateObject10$b, _templateObject11$9;
|
|
46095
46192
|
var Details = function Details(_ref) {
|
|
46096
46193
|
var _activeChannel$member;
|
|
46097
46194
|
var detailsTitleText = _ref.detailsTitleText,
|
|
@@ -46323,7 +46420,7 @@ var Details = function Details(_ref) {
|
|
|
46323
46420
|
return Promise.reject(e);
|
|
46324
46421
|
}
|
|
46325
46422
|
};
|
|
46326
|
-
return /*#__PURE__*/React__default.createElement(Container$
|
|
46423
|
+
return /*#__PURE__*/React__default.createElement(Container$v, {
|
|
46327
46424
|
backgroundColor: backgroundColor,
|
|
46328
46425
|
mounted: mounted,
|
|
46329
46426
|
size: size,
|
|
@@ -46521,14 +46618,14 @@ var Details = function Details(_ref) {
|
|
|
46521
46618
|
QRCodeIcon: QRCodeIcon
|
|
46522
46619
|
}))));
|
|
46523
46620
|
};
|
|
46524
|
-
var Container$
|
|
46621
|
+
var Container$v = styled.div(_templateObject$12 || (_templateObject$12 = _taggedTemplateLiteralLoose(["\n flex: 0 0 auto;\n width: 0;\n border-left: 1px solid ", ";\n //transition: all 0.1s;\n ", "\n background-color: ", ";\n}\n"])), function (props) {
|
|
46525
46622
|
return props.borderColor;
|
|
46526
46623
|
}, function (props) {
|
|
46527
46624
|
return props.mounted && " width: " + (props.size === 'small' ? '300px' : props.size === 'medium' ? '350px' : '400px') + ";";
|
|
46528
46625
|
}, function (props) {
|
|
46529
46626
|
return props.backgroundColor;
|
|
46530
46627
|
});
|
|
46531
|
-
var ChannelDetailsHeader = styled.div(_templateObject2$
|
|
46628
|
+
var ChannelDetailsHeader = styled.div(_templateObject2$X || (_templateObject2$X = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n padding: 16px;\n position: relative;\n height: 64px;\n box-sizing: border-box;\n border-bottom: 1px solid ", ";\n\n & svg {\n cursor: pointer;\n }\n"])), function (props) {
|
|
46532
46629
|
return props.borderColor;
|
|
46533
46630
|
});
|
|
46534
46631
|
var ChatDetails = styled.div(_templateObject3$O || (_templateObject3$O = _taggedTemplateLiteralLoose(["\n //position: relative;\n width: ", ";\n //height: ", ";\n height: ", ";\n overflow-y: auto;\n\n &::-webkit-scrollbar {\n width: 8px;\n background: transparent;\n }\n &::-webkit-scrollbar-thumb {\n background: transparent;\n }\n\n &.show-scrollbar::-webkit-scrollbar-thumb {\n background: ", ";\n border-radius: 4px;\n }\n &.show-scrollbar::-webkit-scrollbar-track {\n background: transparent;\n }\n"])), function (props) {
|
|
@@ -46547,7 +46644,7 @@ var AboutChannelTitle = styled.h4(_templateObject5$B || (_templateObject5$B = _t
|
|
|
46547
46644
|
var AboutChannelText = styled.h3(_templateObject6$w || (_templateObject6$w = _taggedTemplateLiteralLoose(["\n font-size: 15px;\n margin: 0;\n font-weight: 400;\n line-height: 20px;\n color: ", ";\n"])), function (props) {
|
|
46548
46645
|
return props.color;
|
|
46549
46646
|
});
|
|
46550
|
-
var ChannelInfo$4 = styled.div(_templateObject7$
|
|
46647
|
+
var ChannelInfo$4 = styled.div(_templateObject7$v || (_templateObject7$v = _taggedTemplateLiteralLoose(["\n position: relative;\n margin-left: ", ";\n margin-top: ", ";\n text-align: ", ";\n"])), function (props) {
|
|
46551
46648
|
return (!props.direction || props.direction !== 'column') && '16px';
|
|
46552
46649
|
}, function (props) {
|
|
46553
46650
|
return props.direction && props.direction === 'column' && '16px';
|
|
@@ -46571,7 +46668,7 @@ var ChannelNameWrapper = styled.div(_templateObject1$h || (_templateObject1$h =
|
|
|
46571
46668
|
var EditButton = styled.span(_templateObject10$b || (_templateObject10$b = _taggedTemplateLiteralLoose(["\n margin-left: 6px;\n cursor: pointer;\n color: #b2b6be;\n"])));
|
|
46572
46669
|
var PhoneNumberContainer = styled.span(_templateObject11$9 || (_templateObject11$9 = _taggedTemplateLiteralLoose(["\n position: relative;\n display: inline-flex;\n align-items: center;\n cursor: pointer;\n user-select: text;\n"])));
|
|
46573
46670
|
|
|
46574
|
-
var _templateObject$
|
|
46671
|
+
var _templateObject$13;
|
|
46575
46672
|
var ChannelDetailsContainer = function ChannelDetailsContainer(_ref) {
|
|
46576
46673
|
var _ref$size = _ref.size,
|
|
46577
46674
|
size = _ref$size === void 0 ? 'large' : _ref$size,
|
|
@@ -46802,7 +46899,7 @@ var ChannelDetailsContainer = function ChannelDetailsContainer(_ref) {
|
|
|
46802
46899
|
QRCodeIcon: QRCodeIcon
|
|
46803
46900
|
})));
|
|
46804
46901
|
};
|
|
46805
|
-
var DetailsWrapper = styled.div(_templateObject$
|
|
46902
|
+
var DetailsWrapper = styled.div(_templateObject$13 || (_templateObject$13 = _taggedTemplateLiteralLoose(["\n user-select: text;\n"])));
|
|
46806
46903
|
|
|
46807
46904
|
var _path$1z;
|
|
46808
46905
|
function _extends$1D() {
|
|
@@ -46826,7 +46923,7 @@ function SvgChevronDown(props) {
|
|
|
46826
46923
|
})));
|
|
46827
46924
|
}
|
|
46828
46925
|
|
|
46829
|
-
var _templateObject$
|
|
46926
|
+
var _templateObject$14, _templateObject2$Y;
|
|
46830
46927
|
var MessagesScrollToBottomButton = function MessagesScrollToBottomButton(_ref) {
|
|
46831
46928
|
var buttonIcon = _ref.buttonIcon,
|
|
46832
46929
|
buttonWidth = _ref.buttonWidth,
|
|
@@ -46909,7 +47006,7 @@ var MessagesScrollToBottomButton = function MessagesScrollToBottomButton(_ref) {
|
|
|
46909
47006
|
isMuted: channel.muted
|
|
46910
47007
|
}, channel.newMessageCount ? channel.newMessageCount > 99 ? '99+' : channel.newMessageCount : '')), buttonIcon || /*#__PURE__*/React__default.createElement(SvgChevronDown, null)));
|
|
46911
47008
|
};
|
|
46912
|
-
var BottomButton = styled.div(_templateObject$
|
|
47009
|
+
var BottomButton = styled.div(_templateObject$14 || (_templateObject$14 = _taggedTemplateLiteralLoose(["\n transition: all 0.3s ease-in-out;\n position: absolute;\n ", ";\n\n ", ";\n\n ", ";\n right: ", "px;\n\n margin-right: 16px;\n display: flex;\n align-items: center;\n justify-content: center;\n background-color: ", ";\n border: 0.5px solid rgba(0, 0, 0, 0.1);\n border-radius: 50px;\n width: 48px;\n height: 48px;\n cursor: pointer;\n z-index: 14;\n & > svg {\n color: rgba(129, 140, 153, 1);\n }\n\n & > span {\n bottom: 32px;\n right: 0;\n }\n"])), function (props) {
|
|
46913
47010
|
return props.animateFrom === 'bottom' && "bottom: " + (props.bottomOffset + (props.bottomPosition === undefined ? 45 : props.bottomPosition) - 130) + "px";
|
|
46914
47011
|
}, function (props) {
|
|
46915
47012
|
return props.animateFrom === 'right' && "right: " + (props.rightPosition === undefined ? 16 : props.rightPosition - 100) + "px";
|
|
@@ -46920,7 +47017,7 @@ var BottomButton = styled.div(_templateObject$13 || (_templateObject$13 = _tagge
|
|
|
46920
47017
|
}, function (props) {
|
|
46921
47018
|
return props.backgroundColor;
|
|
46922
47019
|
});
|
|
46923
|
-
var UnreadCount$1 = styled.span(_templateObject2$
|
|
47020
|
+
var UnreadCount$1 = styled.span(_templateObject2$Y || (_templateObject2$Y = _taggedTemplateLiteralLoose(["\n position: absolute;\n bottom: 11px;\n right: 16px;\n flex: 0 0 auto;\n margin-left: auto;\n background-color: ", ";\n padding: 0 4px;\n font-size: ", ";\n line-height: 20px;\n min-width: ", ";\n height: ", ";\n text-align: center;\n font-weight: 500;\n color: ", ";\n border-radius: 10px;\n box-sizing: border-box;\n"])), function (props) {
|
|
46924
47021
|
return props.backgroundColor;
|
|
46925
47022
|
}, function (props) {
|
|
46926
47023
|
return props.fontSize || '13px';
|
|
@@ -46963,7 +47060,7 @@ function SvgMention(props) {
|
|
|
46963
47060
|
})));
|
|
46964
47061
|
}
|
|
46965
47062
|
|
|
46966
|
-
var _templateObject$
|
|
47063
|
+
var _templateObject$15, _templateObject2$Z;
|
|
46967
47064
|
var MessagesScrollToUnreadMentionsButton = function MessagesScrollToUnreadMentionsButton(_ref) {
|
|
46968
47065
|
var buttonIcon = _ref.buttonIcon,
|
|
46969
47066
|
buttonWidth = _ref.buttonWidth,
|
|
@@ -47106,7 +47203,7 @@ var MessagesScrollToUnreadMentionsButton = function MessagesScrollToUnreadMentio
|
|
|
47106
47203
|
isMuted: channel.muted
|
|
47107
47204
|
}, channel.newMentionCount ? channel.newMentionCount > 99 ? '99+' : channel.newMentionCount : '')), buttonIcon || /*#__PURE__*/React__default.createElement(SvgMention, null)));
|
|
47108
47205
|
};
|
|
47109
|
-
var BottomButton$1 = styled.div(_templateObject$
|
|
47206
|
+
var BottomButton$1 = styled.div(_templateObject$15 || (_templateObject$15 = _taggedTemplateLiteralLoose(["\n transition: all 0.3s ease-in-out;\n position: absolute;\n ", ";\n\n ", ";\n\n ", ";\n right: ", ";\n margin-right: 16px;\n display: flex;\n align-items: center;\n justify-content: center;\n background-color: ", ";\n border: 0.5px solid rgba(0, 0, 0, 0.1);\n border-radius: 50px;\n width: 48px;\n height: 48px;\n cursor: pointer;\n z-index: 14;\n\n & > svg {\n color: rgba(129, 140, 153, 1);\n }\n\n & > span {\n bottom: 32px;\n right: 0;\n }\n"])), function (props) {
|
|
47110
47207
|
return props.animateFrom === 'bottom' && "bottom: " + (props.bottomOffset + (props.bottomPosition === undefined ? 45 : props.bottomPosition) + (props.showsUnreadMentionsButton ? 60 : 0) - 180) + "px";
|
|
47111
47208
|
}, function (props) {
|
|
47112
47209
|
return props.animateFrom === 'right' && "right: " + (props.rightPosition === undefined ? 16 : props.rightPosition - 100) + "px";
|
|
@@ -47117,7 +47214,7 @@ var BottomButton$1 = styled.div(_templateObject$14 || (_templateObject$14 = _tag
|
|
|
47117
47214
|
}, function (props) {
|
|
47118
47215
|
return props.backgroundColor;
|
|
47119
47216
|
});
|
|
47120
|
-
var UnreadCount$2 = styled.span(_templateObject2$
|
|
47217
|
+
var UnreadCount$2 = styled.span(_templateObject2$Z || (_templateObject2$Z = _taggedTemplateLiteralLoose(["\n position: absolute;\n bottom: 11px;\n right: 16px;\n flex: 0 0 auto;\n margin-left: auto;\n background-color: ", ";\n padding: 0 4px;\n font-size: ", ";\n line-height: 20px;\n min-width: ", ";\n height: ", ";\n text-align: center;\n font-weight: 500;\n color: ", ";\n border-radius: 10px;\n box-sizing: border-box;\n"])), function (props) {
|
|
47121
47218
|
return props.backgroundColor;
|
|
47122
47219
|
}, function (props) {
|
|
47123
47220
|
return props.fontSize || '13px';
|