@threadlabs/looma 0.2.5 → 0.2.7

package/editor/chunk-64GLF274.js

@@ -1,1271 +0,0 @@
-import {
-  MAX_MENTION_RESULT_LIMIT,
-  TABLE_CELL_BACKGROUND_OPTIONS
-} from "./chunk-ZOUKEZ77.js";
-
-// src/table-context-menu.ts
-import {
-  clampRectToViewport,
-  getVisualViewportRect,
-  loomaIconMarkup
-} from "@threadlabs/looma/core";
-var TAG = "ui-editor-table-context-menu";
-function dispatchTableAction(element, action) {
-  element.dispatchEvent(
-    new CustomEvent("looma-editor-table-action", {
-      detail: { action },
-      bubbles: true,
-      composed: true
-    })
-  );
-}
-if (typeof HTMLElement !== "undefined") {
-  class UIEditorTableContextMenuElement extends HTMLElement {
-    positionFrame = null;
-    static get observedAttributes() {
-      return [
-        "open",
-        "cell-background",
-        "can-add-row-before",
-        "can-add-row-after",
-        "can-add-column-before",
-        "can-add-column-after",
-        "can-delete-row",
-        "can-delete-column",
-        "can-delete-table",
-        "can-merge-cells",
-        "can-split-cell"
-      ];
-    }
-    getBoolAttr(name) {
-      return this.hasAttribute(name) && this.getAttribute(name) !== "false";
-    }
-    connectedCallback() {
-      this.render();
-      this.addEventListener("click", this.onClick);
-      window.addEventListener("resize", this.scheduleViewportPosition);
-      window.visualViewport?.addEventListener("resize", this.scheduleViewportPosition);
-      window.visualViewport?.addEventListener("scroll", this.scheduleViewportPosition);
-    }
-    disconnectedCallback() {
-      this.removeEventListener("click", this.onClick);
-      window.removeEventListener("resize", this.scheduleViewportPosition);
-      window.visualViewport?.removeEventListener("resize", this.scheduleViewportPosition);
-      window.visualViewport?.removeEventListener("scroll", this.scheduleViewportPosition);
-      if (this.positionFrame !== null) {
-        cancelAnimationFrame(this.positionFrame);
-        this.positionFrame = null;
-      }
-    }
-    attributeChangedCallback() {
-      this.render();
-    }
-    onClick(e) {
-      const target = e.target;
-      const trigger = target?.closest("[data-action]");
-      const action = trigger?.getAttribute("data-action");
-      if (action) {
-        dispatchTableAction(this, action);
-      }
-    }
-    positionWithinViewport = () => {
-      this.positionFrame = null;
-      const menu = this.querySelector(".ui-editor-table-context-menu");
-      if (!menu) return;
-      menu.style.translate = "";
-      const rect = menu.getBoundingClientRect();
-      const { x: offsetX, y: offsetY } = clampRectToViewport(
-        rect,
-        getVisualViewportRect(window),
-        12
-      );
-      if (offsetX !== 0 || offsetY !== 0) {
-        menu.style.translate = `${offsetX}px ${offsetY}px`;
-      }
-    };
-    scheduleViewportPosition = () => {
-      if (!this.isConnected) return;
-      if (this.positionFrame !== null) cancelAnimationFrame(this.positionFrame);
-      this.positionFrame = requestAnimationFrame(this.positionWithinViewport);
-    };
-    render() {
-      const open = this.getBoolAttr("open");
-      this.hidden = !open;
-      if (!open) return;
-      const currentBackground = this.getAttribute("cell-background");
-      const sections = [
-        {
-          heading: "Cell background",
-          backgrounds: TABLE_CELL_BACKGROUND_OPTIONS
-        },
-        {
-          heading: "Structure",
-          actions: [
-            { action: "add-row-before", label: "Add row above", icon: "panel-top", can: "can-add-row-before" },
-            { action: "add-row-after", label: "Add row below", icon: "panel-bottom", can: "can-add-row-after" },
-            { action: "add-column-before", label: "Add column left", icon: "panel-left", can: "can-add-column-before" },
-            { action: "add-column-after", label: "Add column right", icon: "panel-right", can: "can-add-column-after" }
-          ]
-        },
-        {
-          heading: "Cells",
-          actions: [
-            { action: "clear-cells", label: "Clear selected cells", icon: "eraser" },
-            { action: "merge-cells", label: "Merge cells", icon: "merge", can: "can-merge-cells" },
-            { action: "split-cell", label: "Split cell", icon: "split", can: "can-split-cell" }
-          ]
-        },
-        {
-          heading: "Table",
-          actions: [
-            { action: "delete-row", label: "Delete row", icon: "trash", can: "can-delete-row", tone: "danger" },
-            { action: "delete-column", label: "Delete column", icon: "trash", can: "can-delete-column", tone: "danger" },
-            { action: "delete-table", label: "Delete table", icon: "trash", can: "can-delete-table", tone: "danger" }
-          ]
-        }
-      ];
-      const availableSections = sections.map((section) => {
-        if ("backgrounds" in section) {
-          return section;
-        }
-        return {
-          ...section,
-          actions: section.actions.filter((action) => !action.can || this.getBoolAttr(action.can))
-        };
-      }).filter((section) => "backgrounds" in section ? section.backgrounds.length > 0 : section.actions.length > 0);
-      let html = '<div class="ui-editor-table-context-menu" role="menu">';
-      availableSections.forEach((section, sectionIndex) => {
-        if (sectionIndex > 0) {
-          html += '<div class="ui-editor-table-context-menu__sep"></div>';
-        }
-        html += '<div class="ui-editor-table-context-menu__section" role="none">';
-        html += `<div class="ui-editor-table-context-menu__heading" role="presentation">${section.heading}</div>`;
-        if ("backgrounds" in section) {
-          html += '<div class="ui-editor-table-context-menu__swatches" role="group" aria-label="Cell background">';
-          section.backgrounds.forEach((background) => {
-            const isSelected = (background.value ?? "") === (currentBackground ?? "");
-            html += `<button type="button" class="ui-editor-table-context-menu__swatch-button" role="menuitemradio" aria-checked="${isSelected ? "true" : "false"}" data-action="${background.action}"${isSelected ? ' data-selected="true"' : ""}><span class="ui-editor-table-context-menu__swatch${background.swatch ? "" : " ui-editor-table-context-menu__swatch--default"}"${background.swatch ? ` style="--ui-editor-table-context-swatch:${background.swatch}"` : ""}></span><span class="ui-editor-table-context-menu__swatch-label">${background.label}</span></button>`;
-          });
-          html += "</div>";
-        } else {
-          section.actions.forEach((action) => {
-            const tone = "tone" in action ? action.tone : void 0;
-            html += `<button type="button" role="menuitem" data-action="${action.action}"${tone ? ` data-tone="${tone}"` : ""}>${loomaIconMarkup(action.icon)}<span>${action.label}</span></button>`;
-          });
-        }
-        html += "</div>";
-      });
-      html += "</div>";
-      this.innerHTML = html;
-      this.scheduleViewportPosition();
-    }
-  }
-  if (typeof window !== "undefined" && !customElements.get(TAG)) {
-    customElements.define(TAG, UIEditorTableContextMenuElement);
-  }
-}
-
-// src/table-toolbar.ts
-import { loomaIconMarkup as loomaIconMarkup2 } from "@threadlabs/looma/core";
-var TAG2 = "ui-editor-table-toolbar";
-function dispatchTableAction2(element, action) {
-  element.dispatchEvent(
-    new CustomEvent("looma-editor-table-action", {
-      detail: { action },
-      bubbles: true,
-      composed: true
-    })
-  );
-}
-if (typeof HTMLElement !== "undefined") {
-  class UIEditorTableToolbarElement extends HTMLElement {
-    #overflowOpen = false;
-    static get observedAttributes() {
-      return [
-        "open",
-        "cell-alignment",
-        "cell-background",
-        "can-add-row-after",
-        "can-add-column-after",
-        "can-add-row-before",
-        "can-add-column-before",
-        "can-delete-row",
-        "can-delete-column",
-        "can-delete-table",
-        "can-merge-cells",
-        "can-split-cell"
-      ];
-    }
-    getBoolAttr(name) {
-      return this.hasAttribute(name) && this.getAttribute(name) !== "false";
-    }
-    getAlignmentAttr() {
-      const value = this.getAttribute("cell-alignment");
-      if (value === "center") {
-        return "align-center";
-      }
-      if (value === "right") {
-        return "align-right";
-      }
-      return "align-left";
-    }
-    connectedCallback() {
-      this.render();
-      this.addEventListener("click", this.onClick);
-      document.addEventListener("pointerdown", this.onDocumentPointerDown, true);
-    }
-    disconnectedCallback() {
-      this.removeEventListener("click", this.onClick);
-      document.removeEventListener("pointerdown", this.onDocumentPointerDown, true);
-    }
-    attributeChangedCallback() {
-      this.render();
-    }
-    onClick = (event) => {
-      const target = event.target.closest("[data-action]");
-      if (!target) {
-        return;
-      }
-      if (target.dataset.action === "toggle-overflow") {
-        this.#overflowOpen = !this.#overflowOpen;
-        this.render();
-        return;
-      }
-      const action = target.dataset.action;
-      if (!action) {
-        return;
-      }
-      this.#overflowOpen = false;
-      this.render();
-      dispatchTableAction2(this, action);
-    };
-    onDocumentPointerDown = (event) => {
-      if (!this.#overflowOpen) {
-        return;
-      }
-      const path = typeof event.composedPath === "function" ? event.composedPath() : [];
-      if (path.includes(this)) {
-        return;
-      }
-      if (event.target instanceof Node && this.contains(event.target)) {
-        return;
-      }
-      this.#overflowOpen = false;
-      this.render();
-    };
-    render() {
-      const open = this.getBoolAttr("open");
-      this.hidden = !open;
-      if (!open) {
-        this.#overflowOpen = false;
-        return;
-      }
-      const activeAlignment = this.getAlignmentAttr();
-      const currentBackground = this.getAttribute("cell-background");
-      const alignmentActions = [
-        { action: "align-left", label: "Align left", icon: "align-left" },
-        { action: "align-center", label: "Align center", icon: "align-center" },
-        { action: "align-right", label: "Align right", icon: "align-right" }
-      ];
-      const structuralActions = [
-        { action: "add-row-after", label: "Add row", icon: "rows", can: "can-add-row-after" },
-        { action: "add-column-after", label: "Add column", icon: "columns", can: "can-add-column-after" }
-      ].filter((action) => this.getBoolAttr(action.can));
-      const overflowSections = [
-        {
-          heading: "Structure",
-          actions: [
-            { action: "add-row-before", label: "Add row above", icon: "panel-top", can: "can-add-row-before" },
-            { action: "add-column-before", label: "Add column left", icon: "panel-left", can: "can-add-column-before" }
-          ]
-        },
-        {
-          heading: "Cells",
-          actions: [
-            { action: "clear-cells", label: "Clear selected cells", icon: "eraser" },
-            { action: "merge-cells", label: "Merge selected cells", icon: "merge", can: "can-merge-cells" },
-            { action: "split-cell", label: "Split merged cell", icon: "split", can: "can-split-cell" }
-          ]
-        },
-        {
-          heading: "Table",
-          actions: [
-            { action: "delete-row", label: "Delete row", icon: "trash", can: "can-delete-row", tone: "danger" },
-            { action: "delete-column", label: "Delete column", icon: "trash", can: "can-delete-column", tone: "danger" },
-            { action: "delete-table", label: "Delete table", icon: "trash", can: "can-delete-table", tone: "danger" }
-          ]
-        }
-      ];
-      const availableOverflowSections = overflowSections.map((section) => ({
-        ...section,
-        actions: section.actions.filter((action) => !action.can || this.getBoolAttr(action.can))
-      })).filter((section) => section.actions.length > 0);
-      this.innerHTML = [
-        '<div class="ui-editor-table-toolbar" role="toolbar" aria-label="Table actions">',
-        '<div class="ui-editor-table-toolbar__group" role="group" aria-label="Cell alignment">',
-        alignmentActions.map(
-          (action) => `<button type="button" class="ui-editor-table-toolbar__icon-button" data-action="${action.action}" aria-label="${action.label}" title="${action.label}" aria-pressed="${action.action === activeAlignment ? "true" : "false"}" data-active="${action.action === activeAlignment ? "true" : "false"}">${loomaIconMarkup2(action.icon)}</button>`
-        ).join(""),
-        "</div>",
-        structuralActions.length > 0 ? '<div class="ui-editor-table-toolbar__sep" aria-hidden="true"></div>' : "",
-        structuralActions.length > 0 ? '<div class="ui-editor-table-toolbar__group" role="group" aria-label="Table structure">' : "",
-        structuralActions.map(
-          (action) => `<button type="button" data-action="${action.action}">${loomaIconMarkup2(action.icon)}<span>${action.label}</span></button>`
-        ).join(""),
-        structuralActions.length > 0 ? "</div>" : "",
-        '<div class="ui-editor-table-toolbar__sep" aria-hidden="true"></div>',
-        '<div class="ui-editor-table-toolbar__overflow">',
-        `<button type="button" class="ui-editor-table-toolbar__more" data-action="toggle-overflow" aria-haspopup="menu" aria-expanded="${this.#overflowOpen ? "true" : "false"}">${loomaIconMarkup2("table")}<span>Table options</span>${loomaIconMarkup2("chevron-down", "looma-icon looma-icon--chevron")}</button>`,
-        this.#overflowOpen ? [
-          '<div class="ui-editor-table-toolbar__menu" role="menu" aria-label="More table actions">',
-          '<div class="ui-editor-table-toolbar__menu-section" role="none">',
-          '<div class="ui-editor-table-toolbar__menu-heading" role="presentation">Background</div>',
-          '<div class="ui-editor-table-toolbar__swatches" role="group" aria-label="Cell background">',
-          TABLE_CELL_BACKGROUND_OPTIONS.map((background) => {
-            const isSelected = (background.value ?? "") === (currentBackground ?? "");
-            return `<button type="button" class="ui-editor-table-toolbar__swatch-button" role="menuitemradio" aria-checked="${isSelected ? "true" : "false"}" data-action="${background.action}"${isSelected ? ' data-selected="true"' : ""}><span class="ui-editor-table-toolbar__swatch${background.swatch ? "" : " ui-editor-table-toolbar__swatch--default"}"${background.swatch ? ` style="--ui-editor-table-toolbar-swatch:${background.swatch}"` : ""}></span><span>${background.label}</span></button>`;
-          }).join(""),
-          "</div>",
-          "</div>",
-          availableOverflowSections.map(
-            (section) => [
-              '<div class="ui-editor-table-toolbar__menu-section ui-editor-table-toolbar__menu-section--divided" role="none">',
-              `<div class="ui-editor-table-toolbar__menu-heading" role="presentation">${section.heading}</div>`,
-              section.actions.map((action) => {
-                const tone = "tone" in action ? action.tone : void 0;
-                return `<button type="button" role="menuitem" data-action="${action.action}"${tone ? ` data-tone="${tone}"` : ""}>${loomaIconMarkup2(action.icon)}<span>${action.label}</span></button>`;
-              }).join(""),
-              "</div>"
-            ].join("")
-          ).join(""),
-          "</div>"
-        ].join("") : "",
-        "</div>",
-        "</div>"
-      ].join("");
-    }
-  }
-  if (typeof window !== "undefined" && !customElements.get(TAG2)) {
-    customElements.define(TAG2, UIEditorTableToolbarElement);
-  }
-}
-
-// src/insert-table-grid.ts
-var TAG3 = "ui-editor-insert-table-grid";
-var DEFAULT_MAX_ROWS = 8;
-var DEFAULT_MAX_COLS = 8;
-if (typeof HTMLElement !== "undefined") {
-  class UIEditorInsertTableGridElement extends HTMLElement {
-    static get observedAttributes() {
-      return ["open", "max-rows", "max-cols"];
-    }
-    #maxRows = DEFAULT_MAX_ROWS;
-    #maxCols = DEFAULT_MAX_COLS;
-    #selectedRows = 3;
-    #selectedCols = 3;
-    #previewRows = null;
-    #previewCols = null;
-    #withHeaderRow = true;
-    #selectionCommitted = false;
-    connectedCallback() {
-      this.#maxRows = Math.min(10, Math.max(1, parseInt(this.getAttribute("max-rows") ?? String(DEFAULT_MAX_ROWS), 10) || DEFAULT_MAX_ROWS));
-      this.#maxCols = Math.min(10, Math.max(1, parseInt(this.getAttribute("max-cols") ?? String(DEFAULT_MAX_COLS), 10) || DEFAULT_MAX_COLS));
-      this.render();
-      this.addEventListener("click", this.onClick);
-      this.addEventListener("mouseover", this.onMouseOver);
-      this.addEventListener("mouseleave", this.onMouseLeave);
-    }
-    disconnectedCallback() {
-      this.removeEventListener("click", this.onClick);
-      this.removeEventListener("mouseover", this.onMouseOver);
-      this.removeEventListener("mouseleave", this.onMouseLeave);
-    }
-    attributeChangedCallback(name) {
-      if (name === "max-rows") this.#maxRows = Math.min(10, Math.max(1, parseInt(this.getAttribute("max-rows") ?? String(DEFAULT_MAX_ROWS), 10) || DEFAULT_MAX_ROWS));
-      if (name === "max-cols") this.#maxCols = Math.min(10, Math.max(1, parseInt(this.getAttribute("max-cols") ?? String(DEFAULT_MAX_COLS), 10) || DEFAULT_MAX_COLS));
-      this.render();
-    }
-    onClick(e) {
-      const cell = e.target.closest("[data-row][data-col]");
-      if (cell) {
-        this.#selectedRows = parseInt(cell.getAttribute("data-row") ?? "1", 10);
-        this.#selectedCols = parseInt(cell.getAttribute("data-col") ?? "1", 10);
-        this.#previewRows = null;
-        this.#previewCols = null;
-        this.#selectionCommitted = true;
-        this.updateSelectionPreview();
-        return;
-      }
-      const target = e.target.closest("[data-insert-table]");
-      if (target) {
-        const checkbox = this.querySelector('input[type="checkbox"]');
-        const withHeaderRow = checkbox?.checked ?? this.#withHeaderRow;
-        this.dispatchEvent(
-          new CustomEvent("looma-editor-insert-table", {
-            detail: { rows: this.#selectedRows, cols: this.#selectedCols, withHeaderRow },
-            bubbles: true,
-            composed: true
-          })
-        );
-      }
-    }
-    onMouseOver(e) {
-      const cell = e.target.closest("[data-row][data-col]");
-      if (!cell) {
-        this.#clearPreview();
-        return;
-      }
-      const nextRows = parseInt(cell.getAttribute("data-row") ?? "1", 10);
-      const nextCols = parseInt(cell.getAttribute("data-col") ?? "1", 10);
-      if (nextRows === this.#previewRows && nextCols === this.#previewCols) return;
-      this.#previewRows = nextRows;
-      this.#previewCols = nextCols;
-      this.updateSelectionPreview();
-    }
-    onMouseLeave = () => {
-      this.#clearPreview();
-    };
-    #clearPreview() {
-      if (this.#previewRows === null && this.#previewCols === null) return;
-      this.#previewRows = null;
-      this.#previewCols = null;
-      this.updateSelectionPreview();
-    }
-    updateSelectionPreview() {
-      const activeRows = this.#previewRows ?? this.#selectedRows;
-      const activeCols = this.#previewCols ?? this.#selectedCols;
-      const hint = this.querySelector(".ui-editor-insert-table-grid__hint");
-      if (hint) {
-        hint.textContent = this.#previewRows !== null && this.#previewCols !== null ? `${activeRows} \xD7 ${activeCols}` : `${this.#selectedRows} \xD7 ${this.#selectedCols}${this.#selectionCommitted ? " selected" : ""}`;
-      }
-      const cells = this.querySelectorAll("[data-row][data-col]");
-      for (const cell of cells) {
-        const row = parseInt(cell.getAttribute("data-row") ?? "1", 10);
-        const col = parseInt(cell.getAttribute("data-col") ?? "1", 10);
-        const selected = row <= activeRows && col <= activeCols;
-        cell.classList.toggle("ui-editor-insert-table-grid__cell--selected", selected);
-        cell.setAttribute("aria-pressed", selected ? "true" : "false");
-      }
-    }
-    render() {
-      const open = this.hasAttribute("open") && this.getAttribute("open") !== "false";
-      this.hidden = !open;
-      if (!open) return;
-      let html = '<div class="ui-editor-insert-table-grid">';
-      html += `<p class="ui-editor-insert-table-grid__hint">${this.#selectedRows} \xD7 ${this.#selectedCols}</p>`;
-      html += `<div class="ui-editor-insert-table-grid__grid" role="group" aria-label="Table dimensions" style="--ui-editor-table-grid-rows:${this.#maxRows};--ui-editor-table-grid-cols:${this.#maxCols}">`;
-      for (let r = 1; r <= this.#maxRows; r++) {
-        for (let c = 1; c <= this.#maxCols; c++) {
-          const selected = r <= this.#selectedRows && c <= this.#selectedCols;
-          html += `<button type="button" data-row="${r}" data-col="${c}" aria-label="${r} rows by ${c} columns" aria-pressed="${selected ? "true" : "false"}" class="ui-editor-insert-table-grid__cell${selected ? " ui-editor-insert-table-grid__cell--selected" : ""}"></button>`;
-        }
-      }
-      html += "</div>";
-      html += '<label class="ui-editor-insert-table-grid__header"><input type="checkbox" checked /> Header row</label>';
-      html += '<button type="button" data-insert-table>Insert table</button>';
-      html += "</div>";
-      this.innerHTML = html;
-      const checkbox = this.querySelector('input[type="checkbox"]');
-      if (checkbox) {
-        checkbox.checked = this.#withHeaderRow;
-        checkbox.addEventListener("change", () => {
-          this.#withHeaderRow = checkbox.checked;
-        });
-      }
-      this.updateSelectionPreview();
-    }
-  }
-  if (typeof window !== "undefined" && !customElements.get(TAG3)) {
-    customElements.define(TAG3, UIEditorInsertTableGridElement);
-  }
-}
-
-// src/mention-menu.ts
-import { getVisualViewportRect as getVisualViewportRect2 } from "@threadlabs/looma/core";
-var TAG4 = "ui-editor-mention-menu";
-var MOBILE_BREAKPOINT = 768;
-var MENU_HEIGHT_ESTIMATE = 320;
-var MENU_WIDTH = 320;
-var OFFSET = 8;
-function finiteCoordinate(value) {
-  return typeof value === "number" && Number.isFinite(value) ? value : null;
-}
-function normalizeAnchorRect(value) {
-  if (!value || typeof value !== "object") return null;
-  const rect = value;
-  const x = finiteCoordinate(rect.x);
-  const y = finiteCoordinate(rect.y);
-  const width = finiteCoordinate(rect.width);
-  const height = finiteCoordinate(rect.height);
-  const left = finiteCoordinate(rect.left) ?? x;
-  const top = finiteCoordinate(rect.top) ?? y;
-  const right = finiteCoordinate(rect.right) ?? (left !== null && width !== null ? left + width : null);
-  const bottom = finiteCoordinate(rect.bottom) ?? (top !== null && height !== null ? top + height : null);
-  return left === null || top === null || right === null || bottom === null ? null : { left, top, right, bottom };
-}
-function escapeHtml(value) {
-  return value.replaceAll("&", "&amp;").replaceAll("<", "&lt;").replaceAll(">", "&gt;").replaceAll('"', "&quot;").replaceAll("'", "&#39;");
-}
-function dispatchMenuEvent(element, name, detail) {
-  element.dispatchEvent(new CustomEvent(name, { detail, bubbles: true, composed: true }));
-}
-if (typeof HTMLElement !== "undefined") {
-  class UIEditorMentionMenuElement extends HTMLElement {
-    #open = false;
-    #query = "";
-    #items = [];
-    #selectedIndex = 0;
-    #loading = false;
-    #anchorRect = null;
-    #normalizedAnchorRect = null;
-    get open() {
-      return this.#open;
-    }
-    set open(value) {
-      this.#open = Boolean(value);
-      this.render();
-    }
-    get query() {
-      return this.#query;
-    }
-    set query(value) {
-      this.#query = typeof value === "string" ? value : "";
-      this.render();
-    }
-    get items() {
-      return this.#items;
-    }
-    set items(value) {
-      this.#items = Array.isArray(value) ? value.slice(0, MAX_MENTION_RESULT_LIMIT) : [];
-      if (this.#selectedIndex >= this.#items.length) this.#selectedIndex = 0;
-      this.render();
-    }
-    get selectedIndex() {
-      return this.#selectedIndex;
-    }
-    set selectedIndex(value) {
-      this.#selectedIndex = Number.isFinite(value) ? Math.max(0, value) : 0;
-      this.render();
-    }
-    get loading() {
-      return this.#loading;
-    }
-    set loading(value) {
-      this.#loading = Boolean(value);
-      this.render();
-    }
-    get anchorRect() {
-      return this.#anchorRect;
-    }
-    set anchorRect(value) {
-      const normalized = normalizeAnchorRect(value);
-      this.#anchorRect = normalized ? value : null;
-      this.#normalizedAnchorRect = normalized;
-      this.render();
-    }
-    connectedCallback() {
-      this.setAttribute("role", "listbox");
-      this.setAttribute("aria-label", "Mention a person");
-      this.addEventListener("mousedown", this.onMouseDown);
-      this.addEventListener("click", this.onClick);
-      this.addEventListener("mouseover", this.onMouseOver);
-      window.addEventListener("resize", this.onViewportChange);
-      window.addEventListener("scroll", this.onViewportChange, true);
-      window.visualViewport?.addEventListener("resize", this.onViewportChange);
-      window.visualViewport?.addEventListener("scroll", this.onViewportChange);
-      this.render();
-    }
-    disconnectedCallback() {
-      this.removeEventListener("mousedown", this.onMouseDown);
-      this.removeEventListener("click", this.onClick);
-      this.removeEventListener("mouseover", this.onMouseOver);
-      window.removeEventListener("resize", this.onViewportChange);
-      window.removeEventListener("scroll", this.onViewportChange, true);
-      window.visualViewport?.removeEventListener("resize", this.onViewportChange);
-      window.visualViewport?.removeEventListener("scroll", this.onViewportChange);
-    }
-    onMouseDown = (event) => event.preventDefault();
-    onClick = (event) => {
-      const target = event.target.closest("[data-index]");
-      const index = Number.parseInt(target?.dataset.index ?? "", 10);
-      if (Number.isFinite(index)) {
-        dispatchMenuEvent(
-          this,
-          "looma-editor-mention-menu-select",
-          { index }
-        );
-      }
-    };
-    onMouseOver = (event) => {
-      const target = event.target.closest("[data-index]");
-      const index = Number.parseInt(target?.dataset.index ?? "", 10);
-      if (!Number.isFinite(index) || index === this.#selectedIndex) return;
-      this.#selectedIndex = index;
-      dispatchMenuEvent(
-        this,
-        "looma-editor-mention-menu-highlight",
-        { index }
-      );
-      this.render();
-    };
-    onViewportChange = () => {
-      if (this.#open) this.applyHostPosition();
-    };
-    applyHostPosition() {
-      const rect = this.#normalizedAnchorRect;
-      if (!rect) {
-        this.style.display = "none";
-        return;
-      }
-      const viewport = getVisualViewportRect2(window);
-      this.style.display = "block";
-      this.style.position = "fixed";
-      this.style.zIndex = "500";
-      if (window.innerWidth < MOBILE_BREAKPOINT) {
-        const toolbarReserve = 56;
-        const height = Math.min(MENU_HEIGHT_ESTIMATE, Math.max(0, viewport.height - toolbarReserve));
-        this.style.left = `${viewport.left}px`;
-        this.style.top = `${viewport.top + viewport.height - height - toolbarReserve}px`;
-        this.style.right = "";
-        this.style.bottom = "";
-        this.style.width = `${viewport.width}px`;
-        this.style.maxHeight = `${height}px`;
-        return;
-      }
-      const spaceBelow = viewport.bottom - rect.bottom - OFFSET;
-      const spaceAbove = rect.top - viewport.top - OFFSET;
-      const top = spaceBelow >= MENU_HEIGHT_ESTIMATE || spaceBelow >= spaceAbove ? rect.bottom + OFFSET : rect.top - OFFSET - MENU_HEIGHT_ESTIMATE;
-      const left = Math.max(
-        viewport.left + 8,
-        Math.min(rect.left, viewport.right - MENU_WIDTH - 8)
-      );
-      this.style.top = `${Math.max(viewport.top + 8, top)}px`;
-      this.style.left = `${left}px`;
-      this.style.right = "";
-      this.style.bottom = "";
-      this.style.width = `${MENU_WIDTH}px`;
-      this.style.maxHeight = "";
-    }
-    render() {
-      const visible = this.#open && (this.#loading || this.#items.length > 0) && this.#normalizedAnchorRect;
-      this.hidden = !visible;
-      if (!visible) return;
-      this.applyHostPosition();
-      const optionIdPrefix = this.id || TAG4;
-      const selectedId = `${optionIdPrefix}-option-${this.#selectedIndex}`;
-      this.setAttribute("aria-busy", this.#loading ? "true" : "false");
-      if (this.#items.length > 0) this.setAttribute("aria-activedescendant", selectedId);
-      else this.removeAttribute("aria-activedescendant");
-      const items = this.#items.map((item, index) => {
-        const selected = index === this.#selectedIndex;
-        return [
-          `<li id="${optionIdPrefix}-option-${index}" class="ui-editor-mention-menu__item${selected ? " ui-editor-mention-menu__item--active" : ""}"`,
-          ` role="option" aria-selected="${selected}" data-index="${index}">`,
-          `<span class="ui-editor-mention-menu__avatar" aria-hidden="true">${escapeHtml(item.initials ?? item.label.slice(0, 2).toUpperCase())}</span>`,
-          `<span class="ui-editor-mention-menu__body">`,
-          `<span class="ui-editor-mention-menu__label">${escapeHtml(item.label)}</span>`,
-          item.detail ? `<span class="ui-editor-mention-menu__detail">${escapeHtml(item.detail)}</span>` : "",
-          `</span></li>`
-        ].join("");
-      }).join("");
-      this.innerHTML = [
-        `<div class="ui-editor-mention-menu">`,
-        `<div class="ui-editor-mention-menu__header">`,
-        `<span>People</span><span class="ui-editor-mention-menu__hint">Type after @ to search</span>`,
-        `</div>`,
-        this.#loading && this.#items.length === 0 ? `<div class="ui-editor-mention-menu__loading" role="status">Searching\u2026</div>` : `<ul class="ui-editor-mention-menu__list" role="presentation">${items}</ul>`,
-        `</div>`
-      ].join("");
-    }
-  }
-  if (typeof window !== "undefined" && !customElements.get(TAG4)) {
-    customElements.define(TAG4, UIEditorMentionMenuElement);
-  }
-}
-
-// src/table-overlay.ts
-import {
-  createProximityCoordinator,
-  loomaIconMarkup as loomaIconMarkup3
-} from "@threadlabs/looma/core";
-var TAG5 = "ui-editor-table-overlay";
-var DEFAULT_ROWS = 3;
-var DEFAULT_COLS = 3;
-function sameNumbers(left, right) {
-  return left.length === right.length && left.every((value, index) => value === right[index]);
-}
-function sameActiveCell(left, right) {
-  if (left === right) return true;
-  if (!left || !right) return false;
-  return left.left === right.left && left.top === right.top && left.width === right.width && left.height === right.height && left.rowIndex === right.rowIndex && left.columnIndex === right.columnIndex;
-}
-function sameGeometry(left, right) {
-  if (left === right) return true;
-  if (!left || !right) return false;
-  return sameNumbers(left.rowBoundaries, right.rowBoundaries) && sameNumbers(left.columnBoundaries, right.columnBoundaries) && sameActiveCell(left.activeCell, right.activeCell) && sameActiveCell(left.hoveredCell ?? null, right.hoveredCell ?? null);
-}
-function mapTableCells(table) {
-  const rows = Array.from(table.rows);
-  const grid = [];
-  const coordinates = /* @__PURE__ */ new Map();
-  rows.forEach((row, rowIndex) => {
-    grid[rowIndex] ??= [];
-    let columnIndex = 0;
-    for (const cell of Array.from(row.cells)) {
-      while (grid[rowIndex]?.[columnIndex]) columnIndex += 1;
-      coordinates.set(cell, { rowIndex, columnIndex });
-      const rowSpan = cell.rowSpan === 0 ? rows.length - rowIndex : Math.max(1, cell.rowSpan);
-      const columnSpan = Math.max(1, cell.colSpan);
-      for (let rowOffset = 0; rowOffset < rowSpan; rowOffset += 1) {
-        const gridRow = grid[rowIndex + rowOffset] ??= [];
-        for (let columnOffset = 0; columnOffset < columnSpan; columnOffset += 1) {
-          gridRow[columnIndex + columnOffset] = cell;
-        }
-      }
-      columnIndex += columnSpan;
-    }
-  });
-  return { grid, coordinates };
-}
-function resolveTableCellAt(table, rowIndex, columnIndex) {
-  return mapTableCells(table).grid[rowIndex]?.[columnIndex] ?? null;
-}
-function uniqueSorted(values) {
-  return values.sort((left, right) => left - right).filter((value, index, all) => index === 0 || Math.abs(value - (all[index - 1] ?? value)) >= 0.5).map((value) => Math.round(value * 100) / 100);
-}
-function measureTableOverlayGeometry(table, activeCell, hoveredCell = null) {
-  const tableRect = table.getBoundingClientRect();
-  const rows = Array.from(table.rows);
-  const cells = rows.flatMap((row) => Array.from(row.cells));
-  const { coordinates } = mapTableCells(table);
-  const rowBoundaries = uniqueSorted(rows.flatMap((row) => {
-    const rect = row.getBoundingClientRect();
-    return [rect.top - tableRect.top, rect.bottom - tableRect.top];
-  }));
-  const columnBoundaries = uniqueSorted(cells.flatMap((cell) => {
-    const rect = cell.getBoundingClientRect();
-    return [rect.left - tableRect.left, rect.right - tableRect.left];
-  }));
-  if (!activeCell || !table.contains(activeCell)) {
-    return {
-      rowBoundaries,
-      columnBoundaries,
-      activeCell: null,
-      hoveredCell: measureCellRect(table, hoveredCell, coordinates)
-    };
-  }
-  return {
-    rowBoundaries,
-    columnBoundaries,
-    activeCell: measureCellRect(table, activeCell, coordinates),
-    hoveredCell: measureCellRect(table, hoveredCell, coordinates)
-  };
-}
-function measureCellRect(table, cell, coordinates) {
-  if (!cell || !table.contains(cell)) return null;
-  const tableRect = table.getBoundingClientRect();
-  const cellRect = cell.getBoundingClientRect();
-  const coordinate = coordinates.get(cell);
-  return {
-    left: Math.round((cellRect.left - tableRect.left) * 100) / 100,
-    top: Math.round((cellRect.top - tableRect.top) * 100) / 100,
-    width: Math.round(cellRect.width * 100) / 100,
-    height: Math.round(cellRect.height * 100) / 100,
-    rowIndex: coordinate?.rowIndex ?? 0,
-    columnIndex: coordinate?.columnIndex ?? 0
-  };
-}
-function finiteNumbers(value) {
-  if (!value) return [];
-  const values = value.split(",").map((part) => Number(part.trim()));
-  return values.every(Number.isFinite) ? values : [];
-}
-function fallbackBoundaries(segments, length) {
-  return Array.from({ length: segments + 1 }, (_, index) => index * length / segments);
-}
-if (typeof HTMLElement !== "undefined") {
-  class UIEditorTableOverlayElement extends HTMLElement {
-    static get observedAttributes() {
-      return ["open", "rows", "cols", "row-boundaries", "column-boundaries", "active-cell", "hovered-cell"];
-    }
-    #rows = DEFAULT_ROWS;
-    #cols = DEFAULT_COLS;
-    #activeControlKey = null;
-    #proximity = null;
-    #geometry = null;
-    #renderPending = false;
-    get geometry() {
-      return this.#geometry;
-    }
-    set geometry(value) {
-      if (sameGeometry(this.#geometry, value)) return;
-      this.#geometry = value;
-      this.#scheduleRender();
-    }
-    connectedCallback() {
-      this.#rows = this.#readBoundedNumber("rows", DEFAULT_ROWS);
-      this.#cols = this.#readBoundedNumber("cols", DEFAULT_COLS);
-      this.render();
-      this.addEventListener("click", this.onClick);
-      this.addEventListener("pointerover", this.onPointerOver);
-      this.addEventListener("pointerout", this.onPointerOut);
-      this.addEventListener("focusin", this.onFocusIn);
-      this.addEventListener("focusout", this.onFocusOut);
-      this.#proximity = createProximityCoordinator(this, {
-        pointerTarget: this.ownerDocument,
-        anchorSelector: ".ui-editor-table-overlay__handle[data-ui-affordance]"
-      });
-    }
-    disconnectedCallback() {
-      this.removeEventListener("click", this.onClick);
-      this.removeEventListener("pointerover", this.onPointerOver);
-      this.removeEventListener("pointerout", this.onPointerOut);
-      this.removeEventListener("focusin", this.onFocusIn);
-      this.removeEventListener("focusout", this.onFocusOut);
-      this.#proximity?.destroy();
-      this.#proximity = null;
-    }
-    attributeChangedCallback(name) {
-      if (name === "rows") this.#rows = this.#readBoundedNumber("rows", DEFAULT_ROWS);
-      if (name === "cols") this.#cols = this.#readBoundedNumber("cols", DEFAULT_COLS);
-      this.#scheduleRender();
-    }
-    #scheduleRender() {
-      if (!this.isConnected || this.#renderPending) return;
-      this.#renderPending = true;
-      queueMicrotask(() => {
-        this.#renderPending = false;
-        if (this.isConnected) this.render();
-      });
-    }
-    #readBoundedNumber(name, fallback) {
-      const parsed = Number.parseInt(this.getAttribute(name) ?? String(fallback), 10);
-      return Number.isFinite(parsed) ? Math.min(100, Math.max(1, parsed)) : fallback;
-    }
-    #boundaries(name, segments) {
-      if (this.#geometry) {
-        return name === "row-boundaries" ? this.#geometry.rowBoundaries : this.#geometry.columnBoundaries;
-      }
-      const explicit = finiteNumbers(this.getAttribute(name));
-      if (explicit.length === segments + 1) return explicit;
-      const length = name === "row-boundaries" ? this.getBoundingClientRect().height : this.getBoundingClientRect().width;
-      return fallbackBoundaries(segments, length);
-    }
-    #activeCell() {
-      if (this.#geometry) return this.#geometry.activeCell;
-      const values = finiteNumbers(this.getAttribute("active-cell"));
-      if (values.length !== 6) return null;
-      const [left, top, width, height, rowIndex, columnIndex] = values;
-      if (left === void 0 || top === void 0 || width === void 0 || height === void 0 || rowIndex === void 0 || columnIndex === void 0) return null;
-      return { left, top, width, height, rowIndex, columnIndex };
-    }
-    #hoveredCell() {
-      if (this.#geometry) return this.#geometry.hoveredCell ?? null;
-      const values = finiteNumbers(this.getAttribute("hovered-cell"));
-      if (values.length !== 6) return null;
-      const [left, top, width, height, rowIndex, columnIndex] = values;
-      if (left === void 0 || top === void 0 || width === void 0 || height === void 0 || rowIndex === void 0 || columnIndex === void 0) return null;
-      return { left, top, width, height, rowIndex, columnIndex };
-    }
-    dispatch(detail) {
-      this.dispatchEvent(new CustomEvent(
-        "looma-editor-table-overlay-action",
-        { detail, bubbles: true, composed: true }
-      ));
-    }
-    onClick = (event) => {
-      const target = event.target.closest("button[data-action]");
-      if (!target) return;
-      const action = target.dataset.action;
-      if (!action) return;
-      if (action === "select-row" || action === "select-column") {
-        const rowIndex = Number.parseInt(target.dataset.rowIndex ?? "", 10);
-        const columnIndex = Number.parseInt(target.dataset.columnIndex ?? "", 10);
-        if (Number.isFinite(rowIndex) && Number.isFinite(columnIndex)) {
-          this.dispatch({ action, rowIndex, columnIndex });
-        }
-        return;
-      }
-      if (action === "open-cell-menu") {
-        const rowIndex = Number.parseInt(target.dataset.rowIndex ?? "", 10);
-        const columnIndex = Number.parseInt(target.dataset.columnIndex ?? "", 10);
-        if (!Number.isFinite(rowIndex) || !Number.isFinite(columnIndex)) return;
-        const rect = target.getBoundingClientRect();
-        this.dispatch({
-          action,
-          rowIndex,
-          columnIndex,
-          anchor: { left: rect.left, top: rect.top, right: rect.right, bottom: rect.bottom }
-        });
-        return;
-      }
-      const boundaryIndex = Number.parseInt(target.dataset.boundaryIndex ?? "", 10);
-      if (!Number.isFinite(boundaryIndex) || boundaryIndex < 0) return;
-      this.dispatch({ action, boundaryIndex });
-    };
-    onPointerOver = (event) => {
-      const control = event.target.closest("[data-control-key]");
-      this.#setActiveControl(control?.dataset.controlKey ?? null);
-    };
-    onPointerOut = (event) => {
-      const related = event.relatedTarget;
-      const next = related instanceof Element ? related.closest("[data-control-key]") : null;
-      this.#setActiveControl(next?.dataset.controlKey ?? null);
-    };
-    onFocusIn = (event) => {
-      const control = event.target.closest("[data-control-key]");
-      this.#setActiveControl(control?.dataset.controlKey ?? null);
-    };
-    onFocusOut = (event) => {
-      const related = event.relatedTarget;
-      const next = related instanceof Element ? related.closest("[data-control-key]") : null;
-      this.#setActiveControl(next?.dataset.controlKey ?? null);
-    };
-    #setActiveControl(controlKey) {
-      if (this.#activeControlKey === controlKey) return;
-      this.#activeControlKey = controlKey;
-      this.#syncActiveControl();
-    }
-    #syncActiveControl() {
-      this.querySelectorAll("[data-control-key]").forEach((control) => {
-        control.dataset.active = this.#activeControlKey === control.dataset.controlKey ? "true" : "false";
-      });
-    }
-    #insertionControl(axis, index, position) {
-      const first = index === 0;
-      const action = axis === "row" ? first ? "add-row-before" : "add-row-after" : first ? "add-column-before" : "add-column-after";
-      const noun = axis === "row" ? "row" : "column";
-      const relation = first ? axis === "row" ? "above" : "left" : axis === "row" ? "below" : "right";
-      const label = `Insert ${noun} ${relation}`;
-      const controlKey = `${axis}:${index}`;
-      const positionStyle = axis === "row" ? `top:${position}px;` : `left:${position}px;`;
-      return [
-        `<div class="ui-editor-table-overlay__control ui-editor-table-overlay__control--${axis}"`,
-        ` style="${positionStyle}" data-control-key="${controlKey}"`,
-        ` data-active="${this.#activeControlKey === controlKey ? "true" : "false"}">`,
-        '<span class="ui-editor-table-overlay__line" aria-hidden="true"></span>',
-        '<span class="ui-editor-table-overlay__guide" data-ui-guide aria-hidden="true"></span>',
-        `<button type="button" class="ui-editor-table-overlay__handle" data-ui-affordance="insert-${noun}"`,
-        ` data-action="${action}" data-boundary-index="${index}" aria-label="${label}">`,
-        loomaIconMarkup3("plus"),
-        `<span class="ui-editor-table-overlay__tooltip" role="tooltip">${label}</span>`,
-        "</button>",
-        "</div>"
-      ].join("");
-    }
-    #cellSelectors(cell) {
-      const centerX = cell.left + cell.width / 2;
-      const centerY = cell.top + cell.height / 2;
-      const indexes = `data-row-index="${cell.rowIndex}" data-column-index="${cell.columnIndex}"`;
-      return [
-        `<button type="button" class="ui-editor-table-overlay__selector ui-editor-table-overlay__selector--row" style="top:${centerY}px" data-action="select-row" ${indexes} title="Select row" aria-label="Select row">${loomaIconMarkup3("grip-vertical")}</button>`,
-        `<button type="button" class="ui-editor-table-overlay__selector ui-editor-table-overlay__selector--column" style="left:${centerX}px" data-action="select-column" ${indexes} title="Select column" aria-label="Select column">${loomaIconMarkup3("grip-horizontal")}</button>`
-      ].join("");
-    }
-    #cellMenu(cell) {
-      const indexes = `data-row-index="${cell.rowIndex}" data-column-index="${cell.columnIndex}"`;
-      return `<button type="button" class="ui-editor-table-overlay__cell-menu" style="left:${cell.left + cell.width - 30}px;top:${cell.top + 6}px" data-action="open-cell-menu" ${indexes} title="Cell actions" aria-label="Cell actions">${loomaIconMarkup3("chevron-down")}</button>`;
-    }
-    render() {
-      const open = this.hasAttribute("open") && this.getAttribute("open") !== "false";
-      this.hidden = !open;
-      if (!open) {
-        this.#setActiveControl(null);
-        return;
-      }
-      const rows = this.#boundaries("row-boundaries", this.#rows);
-      const columns = this.#boundaries("column-boundaries", this.#cols);
-      const activeCell = this.#activeCell();
-      const hoveredCell = this.#hoveredCell();
-      this.innerHTML = [
-        '<div class="ui-editor-table-overlay" aria-label="Table controls">',
-        '<div class="ui-editor-table-overlay__rows">',
-        rows.map((position, index) => this.#insertionControl("row", index, position)).join(""),
-        "</div>",
-        '<div class="ui-editor-table-overlay__cols">',
-        columns.map((position, index) => this.#insertionControl("col", index, position)).join(""),
-        "</div>",
-        hoveredCell ? this.#cellSelectors(hoveredCell) : "",
-        activeCell ? this.#cellMenu(activeCell) : "",
-        "</div>"
-      ].join("");
-      this.#syncActiveControl();
-      this.#proximity?.refresh();
-    }
-  }
-  if (typeof window !== "undefined" && !customElements.get(TAG5)) {
-    customElements.define(TAG5, UIEditorTableOverlayElement);
-  }
-}
-
-// src/slash-menu.ts
-import {
-  getVisualViewportRect as getVisualViewportRect3,
-  loomaIconMarkup as loomaIconMarkup4
-} from "@threadlabs/looma/core";
-var TAG6 = "ui-editor-slash-menu";
-var MOBILE_BREAKPOINT2 = 768;
-var MENU_HEIGHT_ESTIMATE2 = 320;
-var MENU_WIDTH2 = 280;
-var OFFSET2 = 8;
-function finiteCoordinate2(value) {
-  return typeof value === "number" && Number.isFinite(value) ? value : null;
-}
-function normalizeAnchorRect2(value) {
-  if (!value || typeof value !== "object") {
-    return null;
-  }
-  const rect = value;
-  const x = finiteCoordinate2(rect.x);
-  const y = finiteCoordinate2(rect.y);
-  const width = finiteCoordinate2(rect.width);
-  const height = finiteCoordinate2(rect.height);
-  const left = finiteCoordinate2(rect.left) ?? x;
-  const top = finiteCoordinate2(rect.top) ?? y;
-  const right = finiteCoordinate2(rect.right) ?? (left !== null && width !== null ? left + width : null);
-  const bottom = finiteCoordinate2(rect.bottom) ?? (top !== null && height !== null ? top + height : null);
-  if (left === null || top === null || right === null || bottom === null) {
-    return null;
-  }
-  return { left, top, right, bottom };
-}
-function dispatchSlashMenuEvent(element, name, detail) {
-  element.dispatchEvent(
-    new CustomEvent(name, {
-      detail,
-      bubbles: true,
-      composed: true
-    })
-  );
-}
-function escapeHtml2(value) {
-  return value.replaceAll("&", "&amp;").replaceAll("<", "&lt;").replaceAll(">", "&gt;").replaceAll('"', "&quot;").replaceAll("'", "&#39;");
-}
-if (typeof HTMLElement !== "undefined") {
-  class UIEditorSlashMenuElement extends HTMLElement {
-    #open = false;
-    #query = "";
-    #items = [];
-    #selectedIndex = 0;
-    #anchorRect = null;
-    #normalizedAnchorRect = null;
-    get open() {
-      return this.#open;
-    }
-    set open(value) {
-      this.#open = Boolean(value);
-      this.render();
-    }
-    get query() {
-      return this.#query;
-    }
-    set query(value) {
-      this.#query = typeof value === "string" ? value : "";
-      this.render();
-    }
-    get items() {
-      return this.#items;
-    }
-    set items(value) {
-      this.#items = Array.isArray(value) ? value : [];
-      this.render();
-    }
-    get selectedIndex() {
-      return this.#selectedIndex;
-    }
-    set selectedIndex(value) {
-      this.#selectedIndex = Number.isFinite(value) ? Math.max(0, value) : 0;
-      this.updateSelectedItem(true);
-    }
-    get anchorRect() {
-      return this.#anchorRect;
-    }
-    set anchorRect(value) {
-      const normalized = normalizeAnchorRect2(value);
-      this.#anchorRect = normalized ? value : null;
-      this.#normalizedAnchorRect = normalized;
-      this.render();
-    }
-    connectedCallback() {
-      this.setAttribute("role", "listbox");
-      this.setAttribute("aria-label", "Insert block");
-      this.addEventListener("mousedown", this.onMouseDown);
-      this.addEventListener("click", this.onClick);
-      this.addEventListener("mouseover", this.onMouseOver);
-      window.addEventListener("resize", this.onViewportChange);
-      window.addEventListener("scroll", this.onViewportChange, true);
-      window.visualViewport?.addEventListener("resize", this.onViewportChange);
-      window.visualViewport?.addEventListener("scroll", this.onViewportChange);
-      this.render();
-    }
-    disconnectedCallback() {
-      this.removeEventListener("mousedown", this.onMouseDown);
-      this.removeEventListener("click", this.onClick);
-      this.removeEventListener("mouseover", this.onMouseOver);
-      window.removeEventListener("resize", this.onViewportChange);
-      window.removeEventListener("scroll", this.onViewportChange, true);
-      window.visualViewport?.removeEventListener("resize", this.onViewportChange);
-      window.visualViewport?.removeEventListener("scroll", this.onViewportChange);
-    }
-    onMouseDown = (event) => {
-      event.preventDefault();
-    };
-    onClick = (event) => {
-      const target = event.target.closest("[data-index]");
-      if (!target) {
-        return;
-      }
-      const index = Number.parseInt(target.dataset.index ?? "", 10);
-      if (!Number.isFinite(index)) {
-        return;
-      }
-      dispatchSlashMenuEvent(this, "looma-editor-slash-menu-select", {
-        index
-      });
-    };
-    onMouseOver = (event) => {
-      const target = event.target.closest("[data-index]");
-      if (!target) {
-        return;
-      }
-      const index = Number.parseInt(target.dataset.index ?? "", 10);
-      if (!Number.isFinite(index) || index === this.#selectedIndex) {
-        return;
-      }
-      this.#selectedIndex = index;
-      this.updateSelectedItem();
-      dispatchSlashMenuEvent(
-        this,
-        "looma-editor-slash-menu-highlight",
-        { index }
-      );
-    };
-    onViewportChange = () => {
-      if (this.#open) {
-        this.applyHostPosition();
-      }
-    };
-    applyHostPosition() {
-      const rect = this.#normalizedAnchorRect;
-      if (!rect) {
-        this.style.display = "none";
-        return;
-      }
-      const viewport = getVisualViewportRect3(window);
-      const viewportWidth = viewport.width;
-      const viewportHeight = viewport.height;
-      this.style.display = "block";
-      this.style.position = "fixed";
-      this.style.zIndex = "500";
-      if (window.innerWidth < MOBILE_BREAKPOINT2) {
-        const toolbarReserve = 56;
-        const menuHeight = Math.min(
-          MENU_HEIGHT_ESTIMATE2,
-          Math.max(0, viewportHeight - toolbarReserve)
-        );
-        this.style.left = `${viewport.left}px`;
-        this.style.right = "";
-        this.style.bottom = "";
-        this.style.top = `${viewport.top + viewportHeight - menuHeight - toolbarReserve}px`;
-        this.style.width = `${viewportWidth}px`;
-        this.style.maxHeight = `${menuHeight}px`;
-        return;
-      }
-      let top;
-      const spaceBelow = viewport.bottom - rect.bottom - OFFSET2;
-      const spaceAbove = rect.top - viewport.top - OFFSET2;
-      if (spaceBelow >= MENU_HEIGHT_ESTIMATE2 || spaceBelow >= spaceAbove) {
-        top = rect.bottom + OFFSET2;
-      } else {
-        top = rect.top - OFFSET2 - MENU_HEIGHT_ESTIMATE2;
-      }
-      let left = rect.left;
-      if (left + MENU_WIDTH2 > viewport.right - 8) {
-        left = viewport.right - MENU_WIDTH2 - 8;
-      }
-      if (left < viewport.left + 8) {
-        left = viewport.left + 8;
-      }
-      this.style.top = `${Math.max(viewport.top + 8, top)}px`;
-      this.style.left = `${left}px`;
-      this.style.right = "";
-      this.style.bottom = "";
-      this.style.width = `${MENU_WIDTH2}px`;
-      this.style.maxHeight = "";
-    }
-    updateSelectedItem(ensureVisible = false) {
-      let selectedOption = null;
-      for (const option of this.querySelectorAll("[data-index]")) {
-        const selected = Number.parseInt(option.dataset.index ?? "", 10) === this.#selectedIndex;
-        option.classList.toggle("ui-editor-slash-menu__item--active", selected);
-        option.setAttribute("aria-selected", selected ? "true" : "false");
-        if (selected) selectedOption = option;
-      }
-      if (ensureVisible) selectedOption?.scrollIntoView?.({ block: "nearest" });
-    }
-    render() {
-      const visible = this.#open && this.#items.length > 0 && this.#normalizedAnchorRect;
-      this.hidden = !visible;
-      if (!visible) {
-        return;
-      }
-      this.applyHostPosition();
-      const query = this.#query.trim();
-      const items = this.#items.map((item, index) => {
-        const activeClass = index === this.#selectedIndex ? " ui-editor-slash-menu__item--active" : "";
-        return [
-          `<li`,
-          ` class="ui-editor-slash-menu__item${activeClass}"`,
-          ` role="option"`,
-          ` aria-selected="${index === this.#selectedIndex ? "true" : "false"}"`,
-          ` data-index="${index}"`,
-          `>`,
-          `<span class="ui-editor-slash-menu__icon" aria-hidden="true">${loomaIconMarkup4(item.icon)}</span>`,
-          `<span class="ui-editor-slash-menu__body">`,
-          `<span class="ui-editor-slash-menu__title">${escapeHtml2(item.title)}</span>`,
-          `<span class="ui-editor-slash-menu__description">${escapeHtml2(item.description)}</span>`,
-          `</span>`,
-          `</li>`
-        ].join("");
-      }).join("");
-      this.innerHTML = [
-        `<div class="ui-editor-slash-menu">`,
-        `<div class="ui-editor-slash-menu__header" aria-hidden="true">`,
-        `<span class="ui-editor-slash-menu__header-label">Insert</span>`,
-        query ? `<span class="ui-editor-slash-menu__header-query">${escapeHtml2(query)}</span>` : "",
-        `</div>`,
-        `<ul class="ui-editor-slash-menu__list" role="presentation">${items}</ul>`,
-        `<div class="ui-editor-slash-menu__footer" aria-hidden="true">`,
-        `<kbd>\u2191\u2193</kbd> navigate &nbsp;\xB7&nbsp; <kbd>\u21B5</kbd> insert &nbsp;\xB7&nbsp; <kbd>Esc</kbd> close`,
-        `</div>`,
-        `</div>`
-      ].join("");
-    }
-  }
-  if (typeof window !== "undefined" && !customElements.get(TAG6)) {
-    customElements.define(TAG6, UIEditorSlashMenuElement);
-  }
-}
-
-// src/toolbar.ts
-var TAG7 = "ui-editor-toolbar";
-if (typeof HTMLElement !== "undefined") {
-  class UIEditorToolbarElement extends HTMLElement {
-    connectedCallback() {
-      if (!this.hasAttribute("role")) {
-        this.setAttribute("role", "toolbar");
-      }
-      if (!this.hasAttribute("aria-label")) {
-        this.setAttribute("aria-label", "Editor toolbar");
-      }
-    }
-  }
-  if (typeof window !== "undefined" && !customElements.get(TAG7)) {
-    customElements.define(TAG7, UIEditorToolbarElement);
-  }
-}
-
-export {
-  resolveTableCellAt,
-  measureTableOverlayGeometry
-};