@sendbird/uikit-react 3.9.3 → 3.10.1

package/cjs/ui/VoiceMessageItemBody.js

@@ -8,19 +8,19 @@ var VoicePlayer_useVoicePlayer = require('../VoicePlayer/useVoicePlayer.js');
 var ui_PlaybackTime = require('./PlaybackTime.js');
 var ui_Loader = require('./Loader.js');
 var ui_Icon = require('./Icon.js');
-var ui_Label = require('../chunks/bundle-aLBNZXTm.js');
-var VoicePlayer_context = require('../chunks/bundle-_c4Xia0x.js');
-require('../chunks/bundle-Z0z4XcoC.js');
+var ui_Label = require('../chunks/bundle-7J3nX_hP.js');
+var VoicePlayer_context = require('../chunks/bundle-rgxTgHrK.js');
+require('../chunks/bundle-JbxviE94.js');
 require('../VoiceRecorder/context.js');
-require('../chunks/bundle-4VdNtJoS.js');
-require('../chunks/bundle-5tXC271i.js');
-require('../chunks/bundle-L7Qg6fc_.js');
-require('../chunks/bundle-8xsZqXyY.js');
+require('../chunks/bundle-qtXdbPNE.js');
+require('../chunks/bundle-kSScygqj.js');
+require('../chunks/bundle-RSklGv-u.js');
+require('../chunks/bundle-Oc2T5_VP.js');
+require('../chunks/bundle-bXLZZTmP.js');
 require('react-dom');
-require('../chunks/bundle-t3HW5lYr.js');
-require('../chunks/bundle-cwoX1jzF.js');
+require('../chunks/bundle-LRCFL23q.js');
+require('../chunks/bundle-WzrocC57.js');
 require('./IconButton.js');
-require('../chunks/bundle-5MABXNJ2.js');
 require('./Button.js');
 require('../useSendbirdStateContext.js');
 require('../withSendbird.js');

package/cjs/ui/Word.js

@@ -1,28 +1,29 @@
 'use strict';
 
 var React = require('react');
-var ui_Label = require('../chunks/bundle-aLBNZXTm.js');
+var ui_Label = require('../chunks/bundle-7J3nX_hP.js');
 var ui_LinkLabel = require('./LinkLabel.js');
-var uuid = require('../chunks/bundle-bXa0UWvD.js');
-var index = require('../chunks/bundle-EE-R19J8.js');
+var uuid = require('../chunks/bundle-INJtS58R.js');
+var index = require('../chunks/bundle-p6kWiWDv.js');
 var ui_MentionLabel = require('./MentionLabel.js');
-require('../chunks/bundle-5MABXNJ2.js');
-require('../chunks/bundle-5tXC271i.js');
+require('../chunks/bundle-bXLZZTmP.js');
+require('../chunks/bundle-kSScygqj.js');
+require('@sendbird/chat/groupChannel');
 require('../utils/message/getOutgoingMessageState.js');
-require('../chunks/bundle-F4Y7xmf1.js');
+require('../chunks/bundle-65IwoStx.js');
 require('./ContextMenu.js');
 require('react-dom');
 require('./SortByRow.js');
 require('./UserProfile.js');
-require('../chunks/bundle-4VdNtJoS.js');
-require('../chunks/bundle-L7Qg6fc_.js');
-require('../chunks/bundle-KfrHCpUu.js');
+require('../chunks/bundle-qtXdbPNE.js');
+require('../chunks/bundle-RSklGv-u.js');
+require('../chunks/bundle-7AS0Rcch.js');
 require('../sendbirdSelectors.js');
-require('../chunks/bundle-BWHZlxBD.js');
-require('../chunks/bundle-t3HW5lYr.js');
-require('../chunks/bundle-yTBDgBVp.js');
+require('../chunks/bundle-135pRm7i.js');
+require('../chunks/bundle-LRCFL23q.js');
+require('../chunks/bundle-7VJjqIPJ.js');
 require('./ImageRenderer.js');
-require('../chunks/bundle-xOGNakZW.js');
+require('../chunks/bundle--d5w7FVF.js');
 require('./Icon.js');
 require('./Button.js');
 require('../useSendbirdStateContext.js');

package/cjs/ui/Word.js.map

@@ -1 +1 @@
-{"version":3,"file":"Word.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"Word.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/cjs/useSendbirdStateContext.js

@@ -4,7 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var React = require('react');
 var withSendbird = require('./withSendbird.js');
-require('./chunks/bundle-5MABXNJ2.js');
+require('./chunks/bundle-bXLZZTmP.js');
 
 /**
  * Example:

package/cjs/utils/message/isVoiceMessage.js

@@ -1,9 +1,10 @@
 'use strict';
 
-var index = require('../../chunks/bundle-EE-R19J8.js');
-require('../../chunks/bundle-5MABXNJ2.js');
+var index = require('../../chunks/bundle-p6kWiWDv.js');
+require('../../chunks/bundle-bXLZZTmP.js');
+require('@sendbird/chat/groupChannel');
 require('./getOutgoingMessageState.js');
-require('../../chunks/bundle-F4Y7xmf1.js');
+require('../../chunks/bundle-65IwoStx.js');
 
 var isVoiceMessage = index.isVoiceMessage;
 

package/cjs/utils/message/isVoiceMessage.js.map

@@ -1 +1 @@
-{"version":3,"file":"isVoiceMessage.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;"}
+{"version":3,"file":"isVoiceMessage.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;"}

package/cjs/withSendbird.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var _tslib = require('./chunks/bundle-5MABXNJ2.js');
+var _tslib = require('./chunks/bundle-bXLZZTmP.js');
 var React = require('react');
 
 var SendbirdSdkContext = React.createContext(null);

package/dist/index.css

@@ -58,6 +58,18 @@
 .sendbird-theme--dark .sendbird-openchannel-conversation-header__left__cover-image--icon {
   background-color: var(--sendbird-dark-background-300);
 }
+.sendbird-word {
+  display: inline;
+  height: -moz-fit-content;
+  height: fit-content;
+}
+
+.sendbird-word__url {
+  margin: 0 4px;
+  display: inline;
+  color: inherit;
+  word-break: break-all;
+}
 .sendbird-open-channel-preview {
   position: relative;
   display: inline-flex;
@@ -185,18 +197,6 @@
 .sendbird--mobile-mode .sendbird-open-channel-preview .sendbird-open-channel-preview__context .sendbird-open-channel-preview__context__participants .sendbird-open-channel-preview__context__participants__count {
   overflow-y: hidden;
 }
-.sendbird-word {
-  display: inline;
-  height: -moz-fit-content;
-  height: fit-content;
-}
-
-.sendbird-word__url {
-  margin: 0 4px;
-  display: inline;
-  color: inherit;
-  word-break: break-all;
-}
 .sendbird-create-open-channel-ui {
   position: relative;
   display: inline-flex;
@@ -657,12 +657,14 @@
   background-color: var(--sendbird-dark-background-700);
 }
 .sendbird-button {
-  display: inline-block;
-  box-shadow: none;
   border-radius: 4px;
-  padding: 0px;
-  font-family: var(--sendbird-font-family-default);
+  box-shadow: none;
   cursor: pointer;
+  font-family: var(--sendbird-font-family-default);
+  padding: 0;
+  display: inline-flex;
+  justify-content: center;
+  align-items: center;
 }
 .sendbird-button:hover {
   box-shadow: none;
@@ -677,12 +679,12 @@
   cursor: not-allowed;
 }
 .sendbird-theme--light .sendbird-button.sendbird-button__disabled {
-  border: none;
   background-color: var(--sendbird-light-background-200);
+  border: none;
 }
 .sendbird-theme--dark .sendbird-button.sendbird-button__disabled {
-  border: none;
   background-color: var(--sendbird-dark-background-400);
+  border: none;
 }
 .sendbird-theme--light .sendbird-button.sendbird-button__disabled:hover {
   background-color: var(--sendbird-light-background-200);
@@ -706,12 +708,12 @@
 }
 
 .sendbird-theme--light .sendbird-button--primary {
-  border: 1px solid var(--sendbird-light-primary-300);
   background-color: var(--sendbird-light-primary-300);
+  border: 1px solid var(--sendbird-light-primary-300);
 }
 .sendbird-theme--dark .sendbird-button--primary {
-  border: 1px solid var(--sendbird-dark-primary-200);
   background-color: var(--sendbird-dark-primary-200);
+  border: 1px solid var(--sendbird-dark-primary-200);
 }
 .sendbird-theme--light .sendbird-button--primary .sendbird-button__text {
   color: var(--sendbird-light-ondark-01);
@@ -728,12 +730,12 @@
   border-color: var(--sendbird-dark-primary-300);
 }
 .sendbird-theme--light .sendbird-button--primary:focus {
-  box-shadow: 0px 0px 0px 2px var(--sendbird-light-primary-300);
   border: 1px solid var(--sendbird-button-border-focus);
+  box-shadow: 0 0 0 2px var(--sendbird-light-primary-300);
 }
 .sendbird-theme--dark .sendbird-button--primary:focus {
-  box-shadow: 0px 0px 0px 2px var(--sendbird-dark-primary-200);
   border: 1px solid var(--sendbird-button-border-focus);
+  box-shadow: 0 0 0 2px var(--sendbird-dark-primary-200);
 }
 .sendbird-theme--light .sendbird-button--primary:active {
   background-color: var(--sendbird-light-primary-500);
@@ -742,16 +744,16 @@
   background-color: var(--sendbird-dark-primary-400);
 }
 .sendbird-theme--light .sendbird-button--primary:focus .sendbird-button--primary:hover {
-  box-shadow: 0px 0px 0px 2px var(--sendbird-light-primary-400);
+  box-shadow: 0 0 0 2px var(--sendbird-light-primary-400);
 }
 .sendbird-theme--dark .sendbird-button--primary:focus .sendbird-button--primary:hover {
-  box-shadow: 0px 0px 0px 2px var(--sendbird-dark-primary-300);
+  box-shadow: 0 0 0 2px var(--sendbird-dark-primary-300);
 }
 .sendbird-theme--light .sendbird-button--primary:focus .sendbird-button--primary:active {
-  box-shadow: 0px 0px 0px 2px var(--sendbird-light-primary-500);
+  box-shadow: 0 0 0 2px var(--sendbird-light-primary-500);
 }
 .sendbird-theme--dark .sendbird-button--primary:focus .sendbird-button--primary:active {
-  box-shadow: 0px 0px 0px 2px var(--sendbird-dark-primary-400);
+  box-shadow: 0 0 0 2px var(--sendbird-dark-primary-400);
 }
 
 .sendbird-button--secondary {
@@ -785,8 +787,8 @@
   color: var(--sendbird-dark-primary-200);
 }
 .sendbird-button--secondary.sendbird-button__disabled {
-  cursor: not-allowed;
   border: none;
+  cursor: not-allowed;
 }
 .sendbird-theme--light .sendbird-button--secondary.sendbird-button__disabled {
   background-color: var(--sendbird-light-background-200);
@@ -822,14 +824,14 @@
   color: var(--sendbird-dark-primary-200);
 }
 .sendbird-button--secondary:focus {
-  border: 1px solid transparent;
   background-color: transparent;
+  border: 1px solid transparent;
 }
 .sendbird-theme--light .sendbird-button--secondary:focus {
-  box-shadow: var(--sendbird-light-primary-300) 0px 0px 0px 2px;
+  box-shadow: var(--sendbird-light-primary-300) 0 0 0 2px;
 }
 .sendbird-theme--dark .sendbird-button--secondary:focus {
-  box-shadow: var(--sendbird-dark-primary-200) 0px 0px 0px 2px;
+  box-shadow: var(--sendbird-dark-primary-200) 0 0 0 2px;
 }
 .sendbird-theme--light .sendbird-button--secondary:focus .sendbird-button__text {
   color: var(--sendbird-light-onlight-01);
@@ -853,13 +855,76 @@
   color: var(--sendbird-dark-primary-200);
 }
 
-.sendbird-theme--light .sendbird-button--danger {
+.sendbird-theme--light .sendbird-button--warning {
+  background-color: transparent;
   border: 1px solid var(--sendbird-light-error-300);
+}
+.sendbird-theme--dark .sendbird-button--warning {
+  background-color: transparent;
+  border: 1px solid var(--sendbird-dark-error-200);
+}
+.sendbird-theme--light .sendbird-button--warning .sendbird-button__text {
+  color: var(--sendbird-light-error-300);
+}
+.sendbird-theme--dark .sendbird-button--warning .sendbird-button__text {
+  color: var(--sendbird-dark-error-200);
+}
+.sendbird-theme--light .sendbird-button--warning:hover {
+  border-color: var(--sendbird-light-error-400);
+}
+.sendbird-theme--dark .sendbird-button--warning:hover {
+  border-color: var(--sendbird-dark-error-100);
+}
+.sendbird-theme--light .sendbird-button--warning:hover .sendbird-button__text {
+  color: var(--sendbird-light-error-400);
+}
+.sendbird-theme--dark .sendbird-button--warning:hover .sendbird-button__text {
+  color: var(--sendbird-dark-error-100);
+}
+.sendbird-theme--light .sendbird-button--warning:focus {
+  border-color: var(--sendbird-light-primary-300);
+}
+.sendbird-theme--light .sendbird-theme--light .sendbird-button--warning:focus .sendbird-button__text {
+  color: var(--sendbird-light-error-300);
+}
+.sendbird-theme--dark .sendbird-theme--light .sendbird-button--warning:focus .sendbird-button__text {
+  color: var(--sendbird-dark-error-200);
+}
+.sendbird-theme--dark .sendbird-button--warning:focus {
+  border-color: var(--sendbird-dark-primary-200);
+}
+.sendbird-theme--light .sendbird-theme--dark .sendbird-button--warning:focus .sendbird-button__text {
+  color: var(--sendbird-light-error-300);
+}
+.sendbird-theme--dark .sendbird-theme--dark .sendbird-button--warning:focus .sendbird-button__text {
+  color: var(--sendbird-dark-error-200);
+}
+.sendbird-theme--light .sendbird-button--warning:hover .sendbird-button--warning:focus {
+  border-color: var(--sendbird-light-primary-300);
+}
+.sendbird-theme--light .sendbird-theme--light .sendbird-button--warning:hover .sendbird-button--warning:focus .sendbird-button__text {
+  color: var(--sendbird-light-error-400);
+}
+.sendbird-theme--dark .sendbird-theme--light .sendbird-button--warning:hover .sendbird-button--warning:focus .sendbird-button__text {
+  color: var(--sendbird-dark-error-100);
+}
+.sendbird-theme--dark .sendbird-button--warning:hover .sendbird-button--warning:focus {
+  border-color: var(--sendbird-dark-primary-200);
+}
+.sendbird-theme--light .sendbird-theme--dark .sendbird-button--warning:hover .sendbird-button--warning:focus .sendbird-button__text {
+  color: var(--sendbird-light-error-400);
+}
+.sendbird-theme--dark .sendbird-theme--dark .sendbird-button--warning:hover .sendbird-button--warning:focus .sendbird-button__text {
+  color: var(--sendbird-dark-error-100);
+}
+
+.sendbird-theme--light .sendbird-button--danger {
   background-color: var(--sendbird-light-error-300);
+  border: 1px solid var(--sendbird-light-error-300);
 }
 .sendbird-theme--dark .sendbird-button--danger {
-  border: 1px solid var(--sendbird-dark-error-200);
   background-color: var(--sendbird-dark-error-200);
+  border: 1px solid var(--sendbird-dark-error-200);
 }
 .sendbird-theme--light .sendbird-button--danger .sendbird-button__text {
   color: var(--sendbird-light-ondark-01);
@@ -876,12 +941,12 @@
   border-color: var(--sendbird-dark-error-400);
 }
 .sendbird-theme--light .sendbird-button--danger:focus {
-  box-shadow: 0px 0px 0px 2px var(--sendbird-light-error-300);
   border-color: var(--sendbird-button-border-focus);
+  box-shadow: 0 0 0 2px var(--sendbird-light-error-300);
 }
 .sendbird-theme--dark .sendbird-button--danger:focus {
-  box-shadow: 0px 0px 0px 2px var(--sendbird-dark-error-300);
   border-color: var(--sendbird-button-border-focus);
+  box-shadow: 0 0 0 2px var(--sendbird-dark-error-300);
 }
 .sendbird-button--danger:active {
   box-shadow: none;
@@ -893,16 +958,16 @@
   background-color: var(--sendbird-dark-error-500);
 }
 .sendbird-theme--light .sendbird-button--danger:hover .sendbird-button--danger:focus {
-  box-shadow: 0px 0px 0px 2px var(--sendbird-light-error-400);
+  box-shadow: 0 0 0 2px var(--sendbird-light-error-400);
 }
 .sendbird-theme--dark .sendbird-button--danger:hover .sendbird-button--danger:focus {
-  box-shadow: 0px 0px 0px 2px var(--sendbird-dark-error-400);
+  box-shadow: 0 0 0 2px var(--sendbird-dark-error-400);
 }
 .sendbird-theme--light .sendbird-button--danger:active .sendbird-button--danger:focus {
-  box-shadow: 0px 0px 0px 2px var(--sendbird-light-error-500);
+  box-shadow: 0 0 0 2px var(--sendbird-light-error-500);
 }
 .sendbird-theme--dark .sendbird-button--danger:active .sendbird-button--danger:focus {
-  box-shadow: 0px 0px 0px 2px var(--sendbird-dark-error-500);
+  box-shadow: 0 0 0 2px var(--sendbird-dark-error-500);
 }
 
 .sendbird-button--disabled {
@@ -998,6 +1063,15 @@
   letter-spacing: normal;
 }
 
+.sendbird-label--button-3 {
+  font-size: 14px;
+  font-weight: 500;
+  font-stretch: normal;
+  font-style: normal;
+  line-height: 1.43;
+  letter-spacing: normal;
+}
+
 .sendbird-label--caption-1 {
   font-size: 14px;
   font-weight: 600;
@@ -2019,7 +2093,9 @@
   height: 20px;
   min-width: 20px;
   border-radius: 10px;
-  display: inline-block;
+  display: inline-flex;
+  justify-content: center;
+  align-items: center;
 }
 .sendbird-theme--light .sendbird-badge {
   background-color: var(--sendbird-light-primary-300);
@@ -2903,6 +2979,14 @@
   color: var(--sendbird-dark-ondark-04);
   border: 1px solid var(--sendbird-dark-ondark-04);
 }
+:root {
+  --sendbird-feedback-buttons-container-height: 36px;
+  --sendbird-feedback-buttons-container-margin-top: 4px;
+  --sendbird-thread-replies-height: 28px;
+  --sendbird-thread-replies-margin-top: 4px;
+  --sendbird-feedback-buttons-container-margin-bottom: 4px;
+}
+
 .sendbird-message-content {
   display: inline-flex;
   flex-direction: row;
@@ -2926,6 +3010,10 @@
   margin-top: -8px;
 }
 
+.sendbird-message-content__feedback {
+  margin-bottom: calc(var(--sendbird-feedback-buttons-container-height) + var(--sendbird-feedback-buttons-container-margin-top) + var(--sendbird-feedback-buttons-container-margin-bottom));
+}
+
 .sendbird-message-content__middle__quote-message__quote {
   width: 100%;
 }
@@ -3159,6 +3247,17 @@
   height: 50px;
   min-width: 136px;
 }
+
+.sendbird-message-content__middle__body-container__feedback-buttons-container {
+  position: absolute;
+  bottom: calc(-1 * (var(--sendbird-feedback-buttons-container-height) + var(--sendbird-feedback-buttons-container-margin-top)));
+  display: flex;
+  gap: 4px;
+}
+
+.sendbird-message-content__middle__body-container__feedback-buttons-container_with-thread-replies {
+  bottom: calc(-1 * (var(--sendbird-feedback-buttons-container-height) + var(--sendbird-feedback-buttons-container-margin-top) + var(--sendbird-thread-replies-height) + var(--sendbird-thread-replies-margin-top)));
+}
 .sendbird-message-item-menu__list__menu-item:focus-visible {
   outline: none;
 }
@@ -4562,6 +4661,122 @@ div.sendbird-text-message-item-body {
 .sendbird-unknown-message-item-body .sendbird-unknown-message-item-body__description {
   display: block;
 }
+.sendbird-iconbutton__feedback {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  background-color: transparent;
+  cursor: pointer;
+  border-radius: 18px;
+  border: 1px solid;
+  padding: 5px 8px;
+}
+.sendbird-theme--light .sendbird-iconbutton__feedback {
+  border-color: var(--sendbird-light-onlight-04);
+}
+.sendbird-theme--dark .sendbird-iconbutton__feedback {
+  border-color: var(--sendbird-dark-ondark-04);
+}
+.sendbird-theme--light .sendbird-iconbutton__feedback:hover {
+  background-color: var(--sendbird-light-background-100);
+}
+.sendbird-theme--dark .sendbird-iconbutton__feedback:hover {
+  background-color: var(--sendbird-dark-background-500);
+}
+.sendbird-iconbutton__feedback.sendbird-iconbutton__feedback__disabled {
+  cursor: not-allowed;
+}
+.sendbird-iconbutton__feedback.sendbird-iconbutton__feedback__disabled:hover {
+  background-color: transparent;
+}
+.sendbird-iconbutton__feedback.sendbird-iconbutton__feedback__pressed:hover {
+  background-color: transparent;
+}
+.sendbird-theme--light .sendbird-iconbutton__feedback.sendbird-iconbutton__feedback__pressed {
+  border-color: var(--sendbird-light-primary-300);
+  background-color: var(--sendbird-light-primary-300);
+}
+.sendbird-theme--dark .sendbird-iconbutton__feedback.sendbird-iconbutton__feedback__pressed {
+  border-color: var(--sendbird-dark-primary-200);
+  background-color: var(--sendbird-dark-primary-200);
+}
+
+.sendbird-iconbutton__feedback__inner {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+.sendbird-theme--light .sendbird-iconbutton__feedback__inner svg path {
+  fill: var(--sendbird-light-onlight-02);
+}
+.sendbird-theme--dark .sendbird-iconbutton__feedback__inner svg path {
+  fill: var(--sendbird-dark-ondark-02);
+}
+.sendbird-theme--light .sendbird-iconbutton__feedback__inner.sendbird-iconbutton__feedback__inner__disabled svg path {
+  fill: var(--sendbird-light-onlight-04);
+}
+.sendbird-theme--dark .sendbird-iconbutton__feedback__inner.sendbird-iconbutton__feedback__inner__disabled svg path {
+  fill: var(--sendbird-dark-ondark-04);
+}
+
+.sendbird-theme--light .sendbird-iconbutton__feedback__inner__pressed svg path {
+  fill: var(--sendbird-light-ondark-01);
+}
+.sendbird-theme--dark .sendbird-iconbutton__feedback__inner__pressed svg path {
+  fill: var(--sendbird-dark-onlight-01);
+}
+.sendbird-message__bottomsheet--feedback-options-menu {
+  width: 100vw;
+  border-radius: 8px 8px 0 0;
+}
+.sendbird-theme--light .sendbird-message__bottomsheet--feedback-options-menu {
+  background-color: var(--sendbird-light-background-50);
+}
+.sendbird-theme--dark .sendbird-message__bottomsheet--feedback-options-menu {
+  background-color: var(--sendbird-dark-background-500);
+}
+.sendbird-message__bottomsheet--feedback-options-menu :first-child {
+  border-radius: 8px 8px 0 0;
+}
+
+.sendbird-message__bottomsheet--feedback-option {
+  cursor: pointer;
+  height: 48px;
+  display: flex;
+  align-items: center;
+  padding: 0 24px;
+}
+.sendbird--mobile-mode .sendbird-message-feedback-modal-content__mobile {
+  max-width: 280px;
+  padding: 16px;
+}
+
+.sendbird-message-feedback-modal-footer__root {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
+
+.sendbird-message-feedback-modal-footer__root_failed {
+  display: flex;
+  justify-content: flex-end;
+  align-items: center;
+  margin-top: 48px;
+}
+
+.sendbird-message-feedback-modal-footer__right-content {
+  display: flex;
+  gap: 8px;
+}
+
+.sendbird-message-feedback-modal-body__root {
+  margin: 21px 0;
+}
+
+.sendbird--mobile-mode .sendbird-message-feedback-modal-header {
+  font-size: 18px;
+  line-height: 1.33;
+}
 .sendbird-fileviewer__header__right__actions__download,
 .sendbird-fileviewer__header__right__actions__delete,
 .sendbird-fileviewer__header__right__actions__close {