@blocknote/core 0.38.0 → 0.39.0

package/src/blocks/index.ts

@@ -0,0 +1,26 @@
+export * from "./Audio/block.js";
+export * from "./Audio/parseAudioElement.js";
+export * from "./Code/block.js";
+export * from "./File/block.js";
+export * from "./Heading/block.js";
+export * from "./Image/block.js";
+export * from "./ListItem/BulletListItem/block.js";
+export * from "./ListItem/CheckListItem/block.js";
+export * from "./ListItem/NumberedListItem/block.js";
+export * from "./ListItem/ToggleListItem/block.js";
+export * from "./PageBreak/block.js";
+export * from "./Paragraph/block.js";
+export * from "./Quote/block.js";
+export * from "./Table/block.js";
+export * from "./Video/block.js";
+
+export { EMPTY_CELL_HEIGHT, EMPTY_CELL_WIDTH } from "./Table/TableExtension.js";
+export * from "./ToggleWrapper/createToggleWrapper.js";
+export * from "./File/helpers/uploadToTmpFilesDotOrg_DEV_ONLY.js";
+export * from "./PageBreak/getPageBreakSlashMenuItems.js";
+
+export * from "./BlockNoteSchema.js";
+export * from "./defaultBlockHelpers.js";
+export * from "./defaultBlocks.js";
+export * from "./defaultBlockTypeGuards.js";
+export * from "./defaultProps.js";

package/src/blocks/utils/listItemEnterHandler.ts

@@ -0,0 +1,42 @@
+import { splitBlockTr } from "../../api/blockManipulation/commands/splitBlock/splitBlock.js";
+import { updateBlockTr } from "../../api/blockManipulation/commands/updateBlock/updateBlock.js";
+import { getBlockInfoFromTransaction } from "../../api/getBlockInfoFromPos.js";
+import { BlockNoteEditor } from "../../editor/BlockNoteEditor.js";
+
+export const handleEnter = (
+  editor: BlockNoteEditor<any, any, any>,
+  listItemType: string,
+) => {
+  const { blockInfo, selectionEmpty } = editor.transact((tr) => {
+    return {
+      blockInfo: getBlockInfoFromTransaction(tr),
+      selectionEmpty: tr.selection.anchor === tr.selection.head,
+    };
+  });
+
+  if (!blockInfo.isBlockContainer) {
+    return false;
+  }
+  const { bnBlock: blockContainer, blockContent } = blockInfo;
+
+  if (!(blockContent.node.type.name === listItemType) || !selectionEmpty) {
+    return false;
+  }
+
+  if (blockContent.node.childCount === 0) {
+    editor.transact((tr) => {
+      updateBlockTr(tr, blockContainer.beforePos, {
+        type: "paragraph",
+        props: {},
+      });
+    });
+    return true;
+  } else if (blockContent.node.childCount > 0) {
+    return editor.transact((tr) => {
+      tr.deleteSelection();
+      return splitBlockTr(tr, tr.selection.from, true);
+    });
+  }
+
+  return false;
+};

package/src/editor/Block.css

@@ -559,76 +559,112 @@ NESTED BLOCKS
 /* TODO: should this be here? */
 
 /* TEXT COLORS */
-[data-text-color="gray"] {
+[data-style-type="textColor"][data-value="gray"],
+[data-text-color="gray"],
+.bn-block:has(> .bn-block-content[data-text-color="gray"]) {
   color: #9b9a97;
 }
 
-[data-text-color="brown"] {
+[data-style-type="textColor"][data-value="brown"],
+[data-text-color="brown"],
+.bn-block:has(> .bn-block-content[data-text-color="brown"]) {
   color: #64473a;
 }
 
-[data-text-color="red"] {
+[data-style-type="textColor"][data-value="red"],
+[data-text-color="red"],
+.bn-block:has(> .bn-block-content[data-text-color="red"]) {
   color: #e03e3e;
 }
 
-[data-text-color="orange"] {
+[data-style-type="textColor"][data-value="orange"],
+[data-text-color="orange"],
+.bn-block:has(> .bn-block-content[data-text-color="orange"]) {
   color: #d9730d;
 }
 
-[data-text-color="yellow"] {
+[data-style-type="textColor"][data-value="yellow"],
+[data-text-color="yellow"],
+.bn-block:has(> .bn-block-content[data-text-color="yellow"]) {
   color: #dfab01;
 }
 
-[data-text-color="green"] {
+[data-style-type="textColor"][data-value="green"],
+[data-text-color="green"],
+.bn-block:has(> .bn-block-content[data-text-color="green"]) {
   color: #4d6461;
 }
 
-[data-text-color="blue"] {
+[data-style-type="textColor"][data-value="blue"],
+[data-text-color="blue"],
+.bn-block:has(> .bn-block-content[data-text-color="blue"]) {
   color: #0b6e99;
 }
 
-[data-text-color="purple"] {
+[data-style-type="textColor"][data-value="purple"],
+[data-text-color="purple"],
+.bn-block:has(> .bn-block-content[data-text-color="purple"]) {
   color: #6940a5;
 }
 
-[data-text-color="pink"] {
+[data-style-type="textColor"][data-value="pink"],
+[data-text-color="pink"],
+.bn-block:has(> .bn-block-content[data-text-color="pink"]) {
   color: #ad1a72;
 }
 
 /* BACKGROUND COLORS */
-[data-background-color="gray"] {
+[data-style-type="backgroundColor"][data-value="gray"],
+[data-background-color="gray"],
+.bn-block:has(> .bn-block-content[data-background-color="gray"]) {
   background-color: #ebeced;
 }
 
-[data-background-color="brown"] {
+[data-style-type="backgroundColor"][data-value="brown"],
+[data-background-color="brown"],
+.bn-block:has(> .bn-block-content[data-background-color="brown"]) {
   background-color: #e9e5e3;
 }
 
-[data-background-color="red"] {
+[data-style-type="backgroundColor"][data-value="red"],
+[data-background-color="red"],
+.bn-block:has(> .bn-block-content[data-background-color="red"]) {
   background-color: #fbe4e4;
 }
 
-[data-background-color="orange"] {
+[data-style-type="backgroundColor"][data-value="orange"],
+[data-background-color="orange"],
+.bn-block:has(> .bn-block-content[data-background-color="orange"]) {
   background-color: #f6e9d9;
 }
 
-[data-background-color="yellow"] {
+[data-style-type="backgroundColor"][data-value="yellow"],
+[data-background-color="yellow"],
+.bn-block:has(> .bn-block-content[data-background-color="yellow"]) {
   background-color: #fbf3db;
 }
 
-[data-background-color="green"] {
+[data-style-type="backgroundColor"][data-value="green"],
+[data-background-color="green"],
+.bn-block:has(> .bn-block-content[data-background-color="green"]) {
   background-color: #ddedea;
 }
 
-[data-background-color="blue"] {
+[data-style-type="backgroundColor"][data-value="blue"],
+[data-background-color="blue"],
+.bn-block:has(> .bn-block-content[data-background-color="blue"]) {
   background-color: #ddebf1;
 }
 
-[data-background-color="purple"] {
+[data-style-type="backgroundColor"][data-value="purple"],
+[data-background-color="purple"],
+.bn-block:has(> .bn-block-content[data-background-color="purple"]) {
   background-color: #eae4f2;
 }
 
-[data-background-color="pink"] {
+[data-style-type="backgroundColor"][data-value="pink"],
+[data-background-color="pink"],
+.bn-block:has(> .bn-block-content[data-background-color="pink"]) {
   background-color: #f4dfeb;
 }