ctrl/shift enter creates new textblock in codeblock

components/Blocks/BaseTextareaBlock.tsx

···
 import { BlockProps } from "./Block";
 import { getCoordinatesInTextarea } from "src/utils/getCoordinatesInTextarea";
 import { focusBlock } from "src/utils/focusBlock";
+import { generateKeyBetween } from "fractional-indexing";
+import { v7 } from "uuid";
+import { elementId } from "src/utils/elementId";
+import { Replicache } from "replicache";
+import { ReplicacheMutators } from "src/replicache";
 
-export function BaseTextareaBlock(
-  props: AutosizeTextareaProps & {
-    block: Pick<BlockProps, "previousBlock" | "nextBlock">;
-  },
-) {
-  let { block, ...passDownProps } = props;
+type BaseTextareaBlockProps = AutosizeTextareaProps & {
+  block: Pick<
+    BlockProps,
+    "previousBlock" | "nextBlock" | "parent" | "position" | "nextPosition"
+  >;
+  rep?: Replicache<ReplicacheMutators> | null;
+  permissionSet?: string;
+};
+
+export function BaseTextareaBlock(props: BaseTextareaBlockProps) {
+  let { block, rep, permissionSet, ...passDownProps } = props;
   return (
     <AsyncValueAutosizeTextarea
       {...passDownProps}
       noWrap
       onKeyDown={(e) => {
+        // Shift-Enter or Ctrl-Enter: create new text block below and focus it
+        if (
+          (e.shiftKey || e.ctrlKey || e.metaKey) &&
+          e.key === "Enter" &&
+          rep &&
+          permissionSet
+        ) {
+          e.preventDefault();
+          let newEntityID = v7();
+          rep.mutate.addBlock({
+            parent: block.parent,
+            type: "text",
+            factID: v7(),
+            permission_set: permissionSet,
+            position: generateKeyBetween(
+              block.position,
+              block.nextPosition || null,
+            ),
+            newEntityID,
+          });
+
+          setTimeout(() => {
+            document.getElementById(elementId.block(newEntityID).text)?.focus();
+          }, 10);
+          return true;
+        }
+
         if (e.key === "ArrowUp") {
           let selection = e.currentTarget.selectionStart;
 

components/Blocks/CodeBlock.tsx

···
   let focusedBlock = useUIState(
     (s) => s.focusedEntity?.entityID === props.entityID,
   );
-  let { permissions } = useEntitySetContext();
+  let entity_set = useEntitySetContext();
+  let { permissions } = entity_set;
   const [html, setHTML] = useState<string | null>(null);
 
   useLayoutEffect(() => {
···
             data-entityid={props.entityID}
             id={elementId.block(props.entityID).input}
             block={props}
+            rep={rep}
+            permissionSet={entity_set.set}
             spellCheck={false}
             autoCapitalize="none"
             autoCorrect="off"