diff --git a/apps/www/content/docs/components/changelog.mdx b/apps/www/content/docs/components/changelog.mdx
index 17d3c1f03f..07b7405781 100644
--- a/apps/www/content/docs/components/changelog.mdx
+++ b/apps/www/content/docs/components/changelog.mdx
@@ -8,10 +8,15 @@ Since Plate UI is not a component library, a changelog is maintained here.
 
 Use the [CLI](https://platejs.org/docs/components/cli) to install the latest version of the components.
 
+## October 2024 #15
+
+### October 1 2024 #15.1
+
+- fix `mention-element`: prevent IME input interruption on MacOS
 
 ## September 2024 #14
 
-### September 29 2024 #15
+### September 29 2024 #14.3
 
 - fix `heading-element`: if the heading is the first block, it should not have a top margin
 
diff --git a/apps/www/src/registry/default/plate-ui/mention-element.tsx b/apps/www/src/registry/default/plate-ui/mention-element.tsx
index d8eaebd77a..724e2af49e 100644
--- a/apps/www/src/registry/default/plate-ui/mention-element.tsx
+++ b/apps/www/src/registry/default/plate-ui/mention-element.tsx
@@ -5,8 +5,11 @@ import type { TMentionElement } from '@udecode/plate-mention';
 import { cn, withRef } from '@udecode/cn';
 import { getHandler } from '@udecode/plate-common';
 import { PlateElement, useElement } from '@udecode/plate-common/react';
+import { IS_APPLE } from '@udecode/utils';
 import { useFocused, useSelected } from 'slate-react';
 
+import { useMounted } from '@/hooks/use-mounted';
+
 export const MentionElement = withRef<
   typeof PlateElement,
   {
@@ -18,6 +21,7 @@ export const MentionElement = withRef<
   const element = useElement<TMentionElement>();
   const selected = useSelected();
   const focused = useFocused();
+  const mounted = useMounted();
 
   return (
     <PlateElement
@@ -35,9 +39,21 @@ export const MentionElement = withRef<
       contentEditable={false}
       {...props}
     >
-      {prefix}
-      {renderLabel ? renderLabel(element) : element.value}
-      {children}
+      {mounted && IS_APPLE ? (
+        // Mac OS IME https://github.com/ianstormtaylor/slate/issues/3490
+        <React.Fragment>
+          {children}
+          {prefix}
+          {renderLabel ? renderLabel(element) : element.value}
+        </React.Fragment>
+      ) : (
+        // Others like Android https://github.com/ianstormtaylor/slate/pull/5360
+        <React.Fragment>
+          {prefix}
+          {renderLabel ? renderLabel(element) : element.value}
+          {children}
+        </React.Fragment>
+      )}
     </PlateElement>
   );
 });