diff --git a/packages/client/src/tiptap/wrappers/callout/index.tsx b/packages/client/src/tiptap/wrappers/callout/index.tsx
index a30a63ab..369190c1 100644
--- a/packages/client/src/tiptap/wrappers/callout/index.tsx
+++ b/packages/client/src/tiptap/wrappers/callout/index.tsx
@@ -4,7 +4,8 @@ import cls from 'classnames';
import { EmojiPicker } from 'components/emoji-picker';
import styles from './index.module.scss';
-export const CalloutWrapper = ({ node, updateAttributes }) => {
+export const CalloutWrapper = ({ editor, node, updateAttributes }) => {
+ const { isEditable } = editor;
const { emoji, textColor, borderColor, backgroundColor } = node.attrs;
const onSelectEmoji = useCallback((emoji) => {
@@ -20,9 +21,13 @@ export const CalloutWrapper = ({ node, updateAttributes }) => {
backgroundColor,
}}
>
-
- {emoji || 'Icon'}
-
+ {isEditable ? (
+
+ {emoji || 'Icon'}
+
+ ) : (
+ emoji && {emoji}
+ )}