Merge branch 'main' into fix/create-link-button-open-state

Author: matthewlipski

packages/core/src/blocks/Code/block.ts

@@ -130,14 +130,18 @@ export const createCodeBlockSpec = createBlockSpec(
         select.value =
           block.props.language || options.defaultLanguage || "text";
 
-        const handleLanguageChange = (event: Event) => {
-          const language = (event.target as HTMLSelectElement).value;
-
-          editor.updateBlock(block.id, { props: { language } });
-        };
-        select.addEventListener("change", handleLanguageChange);
-        removeSelectChangeListener = () =>
-          select.removeEventListener("change", handleLanguageChange);
+        if (editor.isEditable) {
+          const handleLanguageChange = (event: Event) => {
+            const language = (event.target as HTMLSelectElement).value;
+
+            editor.updateBlock(block.id, { props: { language } });
+          };
+          select.addEventListener("change", handleLanguageChange);
+          removeSelectChangeListener = () =>
+            select.removeEventListener("change", handleLanguageChange);
+        } else {
+          select.disabled = true;
+        }
 
         const selectWrapper = document.createElement("div");
         selectWrapper.contentEditable = "false";

packages/core/src/editor/editor.css

@@ -3,6 +3,7 @@
 .bn-editor {
   outline: none;
   padding-inline: 54px;
+  font-synthesis: style weight;
 
   /* Define a set of colors to be used throughout the app for consistency
   see https://atlassian.design/foundations/color for more info */

packages/core/src/extensions/NodeSelectionKeyboard/NodeSelectionKeyboard.ts

@@ -40,6 +40,7 @@ export const NodeSelectionKeyboardExtension = createExtension(
                 // Checks if key press is Enter
                 if (
                   event.key === "Enter" &&
+                  !event.isComposing &&
                   !event.shiftKey &&
                   !event.altKey &&
                   !event.ctrlKey &&

packages/core/src/extensions/TableHandles/TableHandles.ts

@@ -296,9 +296,13 @@ export class TableHandlesView implements PluginView {
         event.clientX >= tableRect.right - 1 &&
         event.clientX < tableRect.right + 20;
 
-      // without this check, we'd also hide draghandles when hovering over them
       const hideHandles =
-        event.clientX > tableRect.right || event.clientY > tableRect.bottom;
+        // always hide handles when the actively hovered table changed
+        this.state?.block.id !== tableBlock.id ||
+        // make sure we don't hide existing handles (keep col / row index) when
+        // we're hovering just above or to the right of a table
+        event.clientX > tableRect.right ||
+        event.clientY > tableRect.bottom;
 
       this.state = {
         ...this.state!,

packages/react/src/components/FilePanel/DefaultTabs/EmbedTab.tsx

@@ -39,7 +39,7 @@ export const EmbedTab = <
 
   const handleURLEnter = useCallback(
     (event: KeyboardEvent) => {
-      if (event.key === "Enter") {
+      if (event.key === "Enter" && !event.nativeEvent.isComposing) {
         event.preventDefault();
         editor.updateBlock(block.id, {
           props: {

packages/react/src/components/FormattingToolbar/DefaultButtons/FileCaptionButton.tsx

@@ -81,7 +81,8 @@ export const FileCaptionButton = () => {
         editorHasBlockWithType(editor, block.type, {
           caption: "string",
         }) &&
-        event.key === "Enter"
+        event.key === "Enter" &&
+        !event.nativeEvent.isComposing
       ) {
         event.preventDefault();
         editor.updateBlock(block.id, {

packages/react/src/components/FormattingToolbar/DefaultButtons/FileRenameButton.tsx

@@ -82,7 +82,8 @@ export const FileRenameButton = () => {
         editorHasBlockWithType(editor, block.type, {
           name: "string",
         }) &&
-        event.key === "Enter"
+        event.key === "Enter" &&
+        !event.nativeEvent.isComposing
       ) {
         event.preventDefault();
         editor.updateBlock(block.id, {

packages/react/src/components/LinkToolbar/EditLinkMenuItems.tsx

@@ -51,7 +51,7 @@ export const EditLinkMenuItems = (
 
   const handleEnter = useCallback(
     (event: KeyboardEvent) => {
-      if (event.key === "Enter") {
+      if (event.key === "Enter" && !event.nativeEvent.isComposing) {
         event.preventDefault();
         editLink(validateUrl(currentUrl), currentText, props.range.from);
         props.setToolbarOpen?.(false);

packages/xl-ai/src/components/AIMenu/AIMenuController.tsx

@@ -5,7 +5,7 @@ import {
   useExtension,
   useExtensionState,
 } from "@blocknote/react";
-import { autoUpdate, offset, size } from "@floating-ui/react";
+import { autoUpdate, flip, offset, size } from "@floating-ui/react";
 import { FC, useMemo } from "react";
 
 import { AIExtension } from "../../AIExtension.js";
@@ -33,7 +33,7 @@ export const AIMenuController = (props: {
         placement: "bottom",
         middleware: [
           offset(10),
-          // flip(),
+          flip(),
           size({
             apply({ rects, elements }) {
               Object.assign(elements.floating.style, {

packages/xl-ai/src/components/AIMenu/PromptSuggestionMenu.tsx

@@ -38,7 +38,7 @@ export const PromptSuggestionMenu = (props: PromptSuggestionMenuProps) => {
 
   const handleEnter = useCallback(
     async (event: KeyboardEvent) => {
-      if (event.key === "Enter") {
+      if (event.key === "Enter" && !event.nativeEvent.isComposing) {
         // console.log("ENTER", currentEditingPrompt);
         onManualPromptSubmit(promptTextToUse);
       }
@@ -71,7 +71,7 @@ export const PromptSuggestionMenu = (props: PromptSuggestionMenuProps) => {
   const handleKeyDown = useCallback(
     (event: KeyboardEvent) => {
       // TODO: handle backspace to close
-      if (event.key === "Enter") {
+      if (event.key === "Enter" && !event.nativeEvent.isComposing) {
         if (items.length > 0) {
           handler(event);
         } else {