basecamp · shved270189 · Jun 10, 2026 · Jul 20, 2026 · shved270189 · Jul 20, 2026
diff --git a/app/assets/stylesheets/lexxy-editor.css b/app/assets/stylesheets/lexxy-editor.css
@@ -479,6 +479,10 @@
     display: none;
   }
 
+  &[data-tables="false"] button[name="table"] {
+    display: none;
+  }
+
   &[data-upload="file"] button[name="image"] {
     display: none;
   }

diff --git a/home/docs/configuration.md b/home/docs/configuration.md
@@ -71,6 +71,7 @@ Editors support the following options, configurable using presets and element at
 - `multiLine`: Pass `false` to force single line editing.
 - `permittedAttachmentTypes`: Restrict the editor to a specific allowlist of attachment content types. Unset (the default) permits any content type. Example: `<lexxy-editor permitted-attachment-types="application/vnd.basecamp.mention application/vnd.basecamp.opengraph-embed"></lexxy-editor>`.
 - `richText`: Pass `false` to disable rich text editing.
+- `tables`: Pass `false` to disable tables entirely. Table insertion is removed, and any existing `<table>` markup is reduced to plain text (cell text preserved) when loaded. By default, tables are enabled.
 - `headings`: Pass an array of heading tags to configure which heading levels are available in the toolbar dropdown. Defaults to `["h2", "h3", "h4"]`. Pass an empty array to remove all heading options; the formatting dropdown still offers "Normal" and "Clear formatting".
 
   ```js

diff --git a/src/config/lexxy.js b/src/config/lexxy.js
@@ -15,6 +15,7 @@ const presets = new Configuration({
     multiLine: true,
     permittedAttachmentTypes: null,
     richText: true,
+    tables: true,
     toolbar: {
       upload: "both"
     },

diff --git a/src/editor/command_dispatcher.js b/src/editor/command_dispatcher.js
@@ -285,6 +285,8 @@ export class CommandDispatcher {
   }
 
   dispatchInsertTable() {
+    if (!this.editorElement.supportsTables) return
+
     this.editor.dispatchCommand(INSERT_TABLE_COMMAND, { "rows": 3, "columns": 3, "includeHeaders": true })
   }
 

diff --git a/src/elements/editor.js b/src/elements/editor.js
@@ -279,6 +279,10 @@ export class LexicalEditorElement extends HTMLElement {
     return this.config.get("richText")
   }
 
+  get supportsTables() {
+    return this.supportsRichText && this.config.get("tables")
+  }
+
   registerAdapter(adapter) {
     this.adapter = adapter
 
@@ -604,7 +608,7 @@ export class LexicalEditorElement extends HTMLElement {
         registerRichText(this.editor),
         registerList(this.editor)
       )
-      this.#registerTableComponents()
+      if (this.supportsTables) this.#registerTableComponents()
       this.#registerCodeLanguagePicker()
       if (this.supportsMarkdown) {
         const transformers = [ ...TRANSFORMERS, HORIZONTAL_DIVIDER ]
@@ -743,6 +747,7 @@ export class LexicalEditorElement extends HTMLElement {
     const toolbar = createElement("lexxy-toolbar")
     toolbar.innerHTML = LexicalToolbar.defaultTemplate
     toolbar.setAttribute("data-attachments", this.supportsAttachments) // Drives toolbar CSS styles
+    toolbar.setAttribute("data-tables", this.supportsTables) // Drives toolbar CSS styles
     toolbar.configure(this.config.get("toolbar"))
     this.prepend(toolbar)
     return toolbar

diff --git a/src/extensions/tables_extension.js b/src/extensions/tables_extension.js
@@ -21,7 +21,7 @@ import { mergeRegister } from "@lexical/utils"
 export class TablesExtension extends LexxyExtension {
 
   get enabled() {
-    return this.editorElement.supportsRichText
+    return this.editorElement.supportsTables
   }
 
   get allowedElements() {

diff --git a/test/browser/fixtures/tables-false.html b/test/browser/fixtures/tables-false.html
@@ -0,0 +1,24 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="utf-8">
+  <meta name="viewport" content="width=device-width,initial-scale=1">
+  <title>Lexxy Test — Tables Disabled</title>
+  <link rel="stylesheet" href="/styles.css">
+</head>
+<body>
+  <form>
+    <div class="title">
+      <input type="text" name="post[title]" placeholder="Post title" aria-label="Post title">
+    </div>
+
+    <div class="body">
+      <lexxy-editor class="lexxy-content" placeholder="Write something..." tables="false" required></lexxy-editor>
+    </div>
+
+    <div class="events"></div>
+  </form>
+
+  <script type="module" src="/editor.js"></script>
+</body>
+</html>
diff --git a/test/browser/tests/tables/disabled.test.js b/test/browser/tests/tables/disabled.test.js
@@ -0,0 +1,73 @@
+import { test } from "../../test_helper.js"
+import { expect } from "@playwright/test"
+import { startMonitoringConsole } from "../../helpers/assertions.js"
+
+const TABLE_HTML =
+  '<figure class="lexxy-content__table-wrapper"><table><thead><tr><th>alpha</th><th>beta</th></tr></thead><tbody><tr><td>gamma</td><td>delta</td></tr></tbody></table></figure><p>After table</p>'
+
+const valueOf = async (editor) => {
+  await editor.flush()
+  return editor.value()
+}
+
+test.describe("Tables disabled", () => {
+  test("the table toolbar button is present by default (regression baseline)", async ({ page }) => {
+    await page.goto("/")
+    await page.waitForSelector("lexxy-toolbar[connected]")
+
+    await expect(page.locator("lexxy-toolbar button[name='table']")).toBeVisible()
+  })
+
+  test("the table toolbar button is hidden when tables are disabled", async ({ page }) => {
+    await page.goto("/tables-false.html")
+    await page.waitForSelector("lexxy-editor[connected]")
+    await page.waitForSelector("lexxy-toolbar[connected]")
+
+    await expect(page.locator("lexxy-toolbar button[name='table']")).toBeHidden()
+  })
+
+  test("dispatching insertTable does nothing when tables are disabled", async ({ page, editor }) => {
+    await page.goto("/tables-false.html")
+    await editor.waitForConnected()
+
+    await editor.click()
+    await editor.locator.evaluate((el) => el.editor.update(() => el.editor.dispatchCommand("insertTable")))
+
+    await expect(editor.content.locator("table")).toHaveCount(0)
+    await expect.poll(() => valueOf(editor)).not.toContain("<table")
+  })
+
+  test("the lexxy-table-tools element is not created when tables are disabled", async ({ page, editor }) => {
+    await page.goto("/tables-false.html")
+    await editor.waitForConnected()
+
+    await expect(editor.locator.locator("lexxy-table-tools")).toHaveCount(0)
+  })
+
+  test("loading a table strips it to plain text when tables are disabled", async ({ page, editor }) => {
+    await page.goto("/tables-false.html")
+    await editor.waitForConnected()
+
+    await editor.setValue(TABLE_HTML)
+
+    await expect(editor.content.locator("table")).toHaveCount(0)
+    await expect.poll(() => valueOf(editor)).not.toContain("<table")
+    await expect.poll(() => valueOf(editor)).not.toContain("lexxy-content__table-wrapper")
+    await expect.poll(() => valueOf(editor)).toContain("After table")
+
+    // strip-to-plain-text must preserve the cell content, not drop it
+    const value = await valueOf(editor)
+    for (const cell of [ "alpha", "beta", "gamma", "delta" ]) {
+      expect(value).toContain(cell)
+    }
+  })
+
+  test("editor connects without crashing when tables are disabled", async ({ page }) => {
+    startMonitoringConsole(page)
+
+    await page.goto("/tables-false.html")
+    await page.waitForSelector("lexxy-editor[connected]")
+
+    expect(page).toHaveNoErrors()
+  })
+})
diff --git a/test/dummy/app/views/posts/_form.html.erb b/test/dummy/app/views/posts/_form.html.erb
@@ -51,6 +51,7 @@
           markdown: params[:markdown_disabled] ? "false" : nil,
           "single-line": params[:multi_line_disabled] ? "true" : nil,
           "rich-text": params[:rich_text_disabled] ? "false" : nil,
+          tables: params[:tables_disabled] ? "false" : nil,
           toolbar: params[:toolbar_disabled] ? "false" : (params[:toolbar_external] ? "external_toolbar" : nil),
           data: (params[:authenticated_storage] == "true" ? { direct_upload_url: authenticated_direct_uploads_url } : {}),
           required: true do %>

diff --git a/test/system/tables_disabled_test.rb b/test/system/tables_disabled_test.rb
@@ -0,0 +1,39 @@
+require "application_system_test_case"
+
+class TablesDisabledTest < ApplicationSystemTestCase
+  setup do
+    visit edit_post_path(posts(:empty), tables_disabled: true)
+    wait_for_editor
+  end
+
+  test "the table toolbar button is not visible" do
+    assert_no_selector "lexxy-toolbar button[name='table']"
+  end
+
+  test "the lexxy-table-tools element is not created" do
+    assert_no_selector "lexxy-editor lexxy-table-tools"
+  end
+
+  test "a saved table is stripped to plain text on load and round-trips without one" do
+    find_editor.value = '<figure class="lexxy-content__table-wrapper"><table><thead><tr><th>alpha</th><th>beta</th></tr></thead><tbody><tr><td>gamma</td><td>delta</td></tr></tbody></table></figure><p>After table</p>'
+
+    assert_no_selector "lexxy-editor table"
+    assert_text "After table"
+    assert_text "alpha"
+    assert_text "delta"
+
+    click_on "Update Post"
+
+    within "article.post" do
+      assert_no_selector "table"
+      assert_text "After table"
+      assert_text "alpha"
+      assert_text "delta"
+    end
+
+    click_on "Edit this post"
+    wait_for_editor
+    assert_no_match(/<table/, find_editor.value)
+    assert_includes find_editor.value, "alpha"
+  end
+end
-Original file line number
+Diff line change
@@ Expand Up / @@ -285,6 +285,8 @@ export class CommandDispatcher { @@
       }
       dispatchInsertTable() {
+        if (!this.editorElement.supportsTables) return
         this.editor.dispatchCommand(INSERT_TABLE_COMMAND, { "rows": 3, "columns": 3, "includeHeaders": true })
       }
@@ Expand Down @@