chore(docs): grammar nits

apps/docs/editor/features/bubble-menu.mdx

@@ -7,7 +7,7 @@ icon: "message-lines"
 
 ## Quick start
 
-Add `BubbleMenu.Default` as a child of `EditorProvider` to get a fully-featured formatting toolbar:
+Add `BubbleMenu.Default` as a child of `EditorProvider` to get a fully-featured formatting toolbar.
 
 ```tsx
 import { StarterKit } from '@react-email/editor/extensions';
@@ -30,7 +30,7 @@ Select text to see the toolbar with formatting, alignment, node type selection,
 
 ## Excluding items
 
-Hide specific items from the default bubble menu using `excludeItems`:
+Hide specific items from the default bubble menu using `excludeItems`.
 
 ```tsx
 <BubbleMenu.Default excludeItems={['strike', 'code', 'uppercase']} />
@@ -54,7 +54,7 @@ All excludable item keys:
 
 ## Hiding on specific nodes or marks
 
-Prevent the bubble menu from appearing on certain node types or when certain marks are active:
+Prevent the bubble menu from appearing on certain node types or when certain marks are active.
 
 ```tsx
 <BubbleMenu.Default
@@ -63,7 +63,7 @@ Prevent the bubble menu from appearing on certain node types or when certain mar
 />
 ```
 
-This is useful when combining the text bubble menu with contextual menus for links, images, or buttons -- each gets its own menu via `BubbleMenu.Root`:
+This is useful when combining the text bubble menu with contextual menus for links, images, or buttons -- each gets its own menu via `BubbleMenu.Root`.
 
 ```tsx
 import { BubbleMenu, bubbleMenuTriggers } from '@react-email/editor/ui';
@@ -88,7 +88,7 @@ const linkPluginKey = new PluginKey('linkBubbleMenu');
 
 ## Composing from primitives
 
-For full control, build a custom bubble menu using the compound component API:
+For full control, build a custom bubble menu using the compound component API.
 
 ```tsx
 import { StarterKit } from '@react-email/editor/extensions';
@@ -137,7 +137,7 @@ and individual items render the toggle buttons.
 
 ## Placement and offset
 
-Control where the bubble menu appears relative to the selection:
+Control where the bubble menu appears relative to the selection.
 
 ```tsx
 <BubbleMenu.Root placement="top" offset={12}>

apps/docs/editor/features/buttons.mdx

@@ -7,7 +7,7 @@ icon: "rectangle-wide"
 
 ## Quick start
 
-Add `BubbleMenu.ButtonDefault` and a slash command for inserting buttons:
+Add `BubbleMenu.ButtonDefault` and a slash command for inserting buttons.
 
 ```tsx
 import { StarterKit } from '@react-email/editor/extensions';
@@ -52,20 +52,20 @@ as a styled button in the editor and serializes to a React Email `<Button>` comp
 
 When you click a button in the editor, the button bubble menu appears with:
 
-- **Edit link** (pencil icon) -- Opens an inline form to change the button's URL
-- **Unlink** -- Removes the button link
+- **Edit link** (pencil icon): Opens an inline form to change the button's URL
+- **Unlink**: Removes the button link
 
 The form validates URLs and lets you apply or cancel changes inline.
 
 ## Inserting buttons programmatically
 
-Use the `setButton` command to insert a button via the editor API:
+Use the `setButton` command to insert a button via the editor API.
 
 ```tsx
 editor.chain().focus().setButton().run();
 ```
 
-This can be triggered from a custom toolbar:
+This can be triggered from a custom toolbar.
 
 ```tsx
 import { useCurrentEditor } from '@tiptap/react';

apps/docs/editor/features/column-layouts.mdx

@@ -7,7 +7,7 @@ icon: "columns-3"
 
 ## Quick start
 
-Column extensions are included in `StarterKit` by default — no extra imports needed:
+Column extensions are included in `StarterKit` by default; no extra imports are needed.
 
 ```tsx
 import { StarterKit } from '@react-email/editor/extensions';
@@ -22,7 +22,7 @@ export function MyEditor() {
 
 ## Inserting columns programmatically
 
-Use the `insertColumns` command to add a column layout:
+Use the `insertColumns` command to add a column layout.
 
 ```tsx
 // Insert a 2-column layout
@@ -37,8 +37,8 @@ editor.chain().focus().insertColumns(4).run();
 
 ## Building a toolbar
 
-Here's a complete example with a toolbar for inserting column layouts, using the `slotBefore`
-prop to position it above the editor:
+Here's a complete example with a toolbar for inserting column layouts. It uses the `slotBefore`
+prop to position the toolbar above the editor.
 
 ```tsx
 import { StarterKit } from '@react-email/editor/extensions';
@@ -105,12 +105,12 @@ export function MyEditor() {
   the editor instance from child components.
 </Tip>
 
-## Via slash commands
+## Slash commands
 
-The default slash commands already include column layouts. Type `/` and search for "columns":
+The default slash commands include column layouts. Type `/` and search for "columns":
 
-- **Two Columns** — `TWO_COLUMNS`
-- **Three Columns** — `THREE_COLUMNS`
-- **Four Columns** — `FOUR_COLUMNS`
+- **Two Columns**: `TWO_COLUMNS`
+- **Three Columns**: `THREE_COLUMNS`
+- **Four Columns**: `FOUR_COLUMNS`
 
 See [Slash Commands](/editor/features/slash-commands) for setup details.

apps/docs/editor/features/email-export.mdx

@@ -7,7 +7,7 @@ icon: "file-export"
 
 ## Quick start
 
-Use `composeReactEmail` to convert editor content into email-ready HTML and plain text:
+Use `composeReactEmail` to convert editor content into email-ready HTML and plain text.
 
 ```tsx
 import { composeReactEmail } from '@react-email/editor/core';
@@ -82,8 +82,9 @@ const { html, text } = await composeReactEmail({ editor, preview: null });
 
 ## Preview text
 
-The `preview` parameter sets the email preview text — the snippet shown in inbox list views
-before the email is opened:
+The `preview` parameter sets the email preview text.
+
+Email preview text is the snippet shown in inbox list views before the email is opened.
 
 ```tsx
 const result = await composeReactEmail({
@@ -97,21 +98,22 @@ Pass `null` to omit preview text.
 ## Using with theming
 
 When the `EmailTheming` extension is in your extensions array, theme styles are automatically
-injected into the exported HTML. The serializer uses the `SerializerPlugin` provided by
-`EmailTheming` to resolve styles for each node based on the current theme and depth in the
+injected into the exported HTML. 
+
+The serializer uses the `SerializerPlugin` provided by `EmailTheming` to resolve styles for each node based on the current theme and depth in the
 document tree.
 
 ```tsx
 const extensions = [StarterKit, EmailTheming.configure({ theme: 'basic' })];
 
 // Later, when exporting:
 const { html } = await composeReactEmail({ editor, preview: null });
-// html includes all theme styles inline
+// ...the html includes all theme styles inline
 ```
 
 ## Full example with export panel
 
-Here's a complete editor with theming and an export panel:
+Here's a complete editor with theming and an export panel.
 
 ```tsx
 import { composeReactEmail } from '@react-email/editor/core';

apps/docs/editor/features/link-editing.mdx

@@ -7,7 +7,7 @@ icon: "link"
 
 ## Quick start
 
-Use `BubbleMenu.LinkDefault` to add an inline link editing toolbar:
+Use `BubbleMenu.LinkDefault` to add an inline link editing toolbar.
 
 ```tsx
 import { StarterKit } from '@react-email/editor/extensions';
@@ -35,16 +35,16 @@ export function MyEditor() {
 
 When you click on a link in the editor, the link bubble menu appears with:
 
-- **Edit button** -- Opens an inline form to change the URL
-- **Open button** -- Opens the link in a new tab
-- **Unlink button** -- Removes the link, keeping the text
+- **Edit button**: Opens an inline form to change the URL
+- **Open button**: Opens the link in a new tab
+- **Unlink button**: Removes the link, keeping the text
 
 To **add a new link**, select text and press `Cmd+K` (or `Ctrl+K` on Windows/Linux).
 
-## Using with the text bubble menu
+## Bubble menu
 
 When combining the link bubble menu with `BubbleMenu.Default`, use `hideWhenActiveMarks` to prevent
-the text bubble menu from appearing when a link is focused:
+the text bubble menu from appearing when a link is focused.
 
 ```tsx
 import { BubbleMenu } from '@react-email/editor/ui';
@@ -55,18 +55,18 @@ import { BubbleMenu } from '@react-email/editor/ui';
 </EditorProvider>
 ```
 
-Without `hideWhenActiveMarks`, both menus would try to show at the same time when a link is selected.
+Without `hideWhenActiveMarks`, both menus will try to show at the same time when a link is selected.
 
 ## HTML content with links
 
 When using HTML strings as content, `<a>` tags are automatically parsed into the editor's
-link model:
+link model.
 
 ```tsx
 const content = `
   <p>Visit <a href="https://react.email" target="_blank">React Email</a> for more info.</p>
 `;
 ```
 
-The link extension is included in `StarterKit` with `openOnClick` disabled by default,
-so clicking a link in edit mode focuses it rather than navigating away.
+The link extension is included in `StarterKit` with `openOnClick` disabled by default.
+This means that clicking a link in edit mode focuses it rather than navigating away.

apps/docs/editor/features/slash-commands.mdx

@@ -135,7 +135,7 @@ import { BUTTON, SlashCommand } from '@react-email/editor/ui';
 <SlashCommand.Root items={[BUTTON]} />
 ```
 
-This is useful when you want a minimal command palette — for example, only allowing button insertion.
+This is useful when you want a minimal command palette. For example, only allowing button insertion.
 
 ## Controlling visibility
 

apps/docs/editor/features/styling.mdx

@@ -48,7 +48,7 @@ element to restyle the editor:
 
 The default theme supports dark mode in two ways:
 
-**Automatic** — via `prefers-color-scheme`:
+**Automatic**: via `prefers-color-scheme`.
 
 ```css
 @media (prefers-color-scheme: dark) {
@@ -60,7 +60,7 @@ The default theme supports dark mode in two ways:
 }
 ```
 
-**Class-based** — via a `.dark` class on any ancestor:
+**Class-based**: via a `.dark` class on any ancestor.
 
 ```css
 .dark {
@@ -105,7 +105,7 @@ Available `data-item` values: `bold`, `italic`, `underline`, `strike`, `code`, `
 
 ### Node selector
 
-The block type dropdown inside the bubble menu:
+The block type dropdown inside the bubble menu
 
 ```css
 /* Dropdown wrapper */
@@ -126,7 +126,7 @@ The block type dropdown inside the bubble menu:
 
 ### Link selector
 
-The link popover inside the bubble menu:
+The link popover inside the bubble menu
 
 ```css
 /* Wrapper */
@@ -150,7 +150,7 @@ The link popover inside the bubble menu:
 
 ### Link bubble menu
 
-The standalone menu that appears when clicking a link:
+The standalone menu that appears when clicking a link
 
 ```css
 /* Container */
@@ -174,7 +174,7 @@ The standalone menu that appears when clicking a link:
 
 ### Button bubble menu
 
-The menu that appears when clicking an email button:
+The menu that appears when clicking an email button
 
 ```css
 /* Container */
@@ -190,7 +190,7 @@ The menu that appears when clicking an email button:
 
 ### Image bubble menu
 
-The menu that appears when clicking an image:
+The menu that appears when clicking an image
 
 ```css
 /* Container */
@@ -225,8 +225,7 @@ The menu that appears when clicking an image:
 
 ## Editor content classes
 
-The editor content area uses the `.tiptap` root class from [TipTap](https://tiptap.dev/docs/editor/getting-started/style-editor). Target content elements with
-`.tiptap` as a prefix:
+The editor content area uses the `.tiptap` root class from [TipTap](https://tiptap.dev/docs/editor/getting-started/style-editor). Target content elements with `.tiptap` as a prefix.
 
 ### Typography
 
@@ -280,7 +279,7 @@ The editor content area uses the `.tiptap` root class from [TipTap](https://tipt
 
 ### Text alignment
 
-The alignment attribute renders as an HTML attribute on block nodes:
+The alignment attribute renders as an HTML attribute on block nodes.
 
 ```css
 .tiptap [alignment="left"] { text-align: left; }
@@ -290,7 +289,7 @@ The alignment attribute renders as an HTML attribute on block nodes:
 
 ### Column data types
 
-Column layouts also use `data-type` attributes:
+Column layouts also use `data-type` attributes.
 
 ```css
 .tiptap [data-type="two-columns"] { }
@@ -304,7 +303,7 @@ Column layouts also use `data-type` attributes:
 
 ### Custom brand colors
 
-Override the CSS variables to match your brand:
+Override the CSS variables to match your brand.
 
 ```css
 .my-editor {
@@ -330,7 +329,7 @@ Override the CSS variables to match your brand:
 
 ### Custom bubble menu item styles
 
-Increase icon size and change the active state color:
+Increase icon size and change the active state color.
 
 ```css
 [data-re-bubble-menu-item] svg {
@@ -346,7 +345,7 @@ Increase icon size and change the active state color:
 
 ### Custom slash command appearance
 
-Make the command palette wider with a custom background:
+Make the command palette wider with a custom background color.
 
 ```css
 [data-re-slash-command] {
@@ -367,7 +366,7 @@ Make the command palette wider with a custom background:
 
 ### Styling editor content
 
-Customize how content looks inside the editor:
+Customize how content looks inside the editor.
 
 ```css
 /* Custom heading styles */

apps/docs/editor/features/theming.mdx

@@ -36,7 +36,7 @@ component.
 During [`composeReactEmail`](/editor/api-reference/compose-react-email), the `EmailTheming`
 plugin acts as a `SerializerPlugin` that resolves styles for each node based on its type and
 depth in the document tree. These styles are then **inlined directly** onto the rendered React
-Email components as `style` attributes — this is necessary because email clients don't
+Email components as `style` attributes. This is necessary because email clients don't
 reliably support `<style>` tags or external stylesheets.
 
 The resolved styles are passed to each node's `renderToReactEmail()` method via the `style`
@@ -48,7 +48,7 @@ The editor ships with two themes:
 
 | Theme | Description |
 |-------|-------------|
-| `'basic'` | Full styling — typography, spacing, borders, and visual hierarchy. This is the default. |
+| `'basic'` | Full styling: typography, spacing, borders, and visual hierarchy. This is the **default**. |
 | `'minimal'` | Essentially no styles. Gives you a blank slate to build your own look from scratch. |
 
 Select a theme with `.configure()`:
@@ -123,7 +123,7 @@ Themes define styles for the following email components:
 ## Theme-aware serialization
 
 When `EmailTheming` is in your extensions array, the `composeReactEmail` function automatically
-applies theme styles to the exported HTML. No extra configuration needed:
+applies theme styles to the exported HTML. No extra configuration is needed.
 
 ```tsx
 import { composeReactEmail } from '@react-email/editor/core';