@atlaskit/editor-plugin-block-menu 6.0.7 → 6.0.9

package/CHANGELOG.md

@@ -1,5 +1,24 @@
 # @atlaskit/editor-plugin-block-menu
 
+## 6.0.9
+
+### Patch Changes
+
+- [`c77659e594c55`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/c77659e594c55) -
+  [ux] Editor-4020: Fix decision to quote and code block, fixed empty panel to code block"
+
+## 6.0.8
+
+### Patch Changes
+
+- [`bdcaf574d7d2d`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/bdcaf574d7d2d) -
+  Fix transformation of multiple headings and paragraphs to codeblocks
+- [`68ebba7ccdc1b`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/68ebba7ccdc1b) -
+  [EDITOR-4157] Fix editor freeze when transforming mediaSingle at bottom of document
+- [`fef9134c6feb5`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/fef9134c6feb5) -
+  [ux] Implement multiselect transformations for text (heading, paragraph) nodes
+- Updated dependencies
+
 ## 6.0.7
 
 ### Patch Changes

package/dist/cjs/editor-commands/transform-node-utils/flattenStep.js

@@ -12,16 +12,6 @@ var flattenStep = exports.flattenStep = function flattenStep(nodes, context) {
   if (!targetNodeType || !paragraph) {
     return nodes;
   }
-
-  // TODO: EDITOR-2920 - Implement flattening logic.
-  var isTargetCodeBlock = targetNodeTypeName === 'codeBlock';
-  if (isTargetCodeBlock) {
-    // This strips explicitly text nodes
-    var codeBlockContent = nodes.map(function (node) {
-      return node.content.textBetween(0, node.content.size, '\n');
-    }).join('\n');
-    return [schema.nodes.codeBlock.create({}, schema.text(codeBlockContent))];
-  }
   return nodes.map(function (node) {
     var isValidWithin = targetNodeType.validContent(node.content);
     if (!isValidWithin) {

package/dist/cjs/editor-commands/transform-node-utils/steps/applyTargetTextTypeStep.js

@@ -5,18 +5,21 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.applyTargetTextTypeStep = void 0;
 /**
- * Applies target text type conversion. If the target type is a heading, converts textblock nodes
- * (paragraphs, headings) to heading nodes with the specified level. Otherwise, leaves nodes unchanged.
- * Non-textblock nodes are always left unchanged.
+ * Applies target text type conversion. Converts textblock nodes to the target text type
+ * (paragraph or heading). Non-textblock nodes are left unchanged.
  *
  * @example
  * Input:
- * - paragraph "Heading 1"
- * - paragraph "Heading 2"
+ * - paragraph "Text 1"
+ * - paragraph "Text 2"
  *
  * Output (with target: heading, level: 2):
- * - heading (level: 2) "Heading 1"
- * - heading (level: 2) "Heading 2"
+ * - heading (level: 2) "Text 1"
+ * - heading (level: 2) "Text 2"
+ *
+ * Output (with target: paragraph):
+ * - paragraph "Text 1"
+ * - paragraph "Text 2"
  *
  * @param nodes
  * @param context
@@ -26,23 +29,28 @@ var applyTargetTextTypeStep = exports.applyTargetTextTypeStep = function applyTa
   var schema = context.schema,
     targetNodeTypeName = context.targetNodeTypeName,
     targetAttrs = context.targetAttrs;
-  if (targetNodeTypeName !== 'heading') {
+  if (targetNodeTypeName !== 'heading' && targetNodeTypeName !== 'paragraph') {
     return nodes;
   }
-  var headingType = schema.nodes.heading;
-  if (!headingType) {
+  var targetType = schema.nodes[targetNodeTypeName];
+  if (!targetType) {
     return nodes;
   }
-
-  // Default to level 1 if no level is specified
-  // The level should ideally come from targetAttrs, but if not available, use default
-  var headingLevel = typeof (targetAttrs === null || targetAttrs === void 0 ? void 0 : targetAttrs.level) === 'number' ? targetAttrs.level : 1;
   return nodes.map(function (node) {
+    // If codeblock, return nodes as is
+    if (targetNodeTypeName === 'heading' && node.type.name === 'codeBlock') {
+      return node;
+    }
     if (node.isTextblock) {
-      // Convert textblock nodes (paragraphs, headings) to heading with specified level
-      return headingType.create({
-        level: headingLevel
-      }, node.content, node.marks);
+      // Convert textblock nodes to the target type with content preserved
+      var attrs = {};
+      if (targetNodeTypeName === 'heading') {
+        var level = typeof (targetAttrs === null || targetAttrs === void 0 ? void 0 : targetAttrs.level) === 'number' ? targetAttrs.level : 1;
+        attrs = {
+          level: level
+        };
+      }
+      return targetType.create(attrs, node.content, node.marks);
     }
     // Non-textblock nodes are left unchanged
     return node;

package/dist/cjs/editor-commands/transform-node-utils/steps/wrapMixedContentStep.js

@@ -10,6 +10,34 @@ var _model = require("@atlaskit/editor-prosemirror/model");
 var _marks = require("../marks");
 var _types = require("../types");
 var _utils = require("../utils");
+/**
+ * Creates a layout section with two columns, where the first column contains the provided content.
+ */
+var createLayoutSection = function createLayoutSection(content, layoutSection, layoutColumn) {
+  var columnOne = layoutColumn.createAndFill({}, (0, _marks.removeDisallowedMarks)(content, layoutColumn));
+  var columnTwo = layoutColumn.createAndFill();
+  if (!columnOne || !columnTwo) {
+    return null;
+  }
+  return layoutSection.createAndFill({}, [columnOne, columnTwo]);
+};
+
+/**
+ * Creates a container with text content (for codeblocks).
+ */
+var createTextContentContainer = function createTextContentContainer(textContentArray, targetNodeType, schema) {
+  var textContent = textContentArray.join('\n');
+  var textNode = textContent ? schema.text(textContent) : null;
+  return targetNodeType.createAndFill({}, textNode);
+};
+
+/**
+ * Creates a regular container with node content.
+ */
+var createNodeContentContainer = function createNodeContentContainer(nodeContent, targetNodeType) {
+  return targetNodeType.createAndFill({}, nodeContent);
+};
+
 /**
  * Handles the edge case where transforming from a container to another container results in
  * all content breaking out (no valid children for the target). In this case, creates an empty
@@ -34,12 +62,16 @@ var handleEmptyContainerEdgeCase = function handleEmptyContainerEdgeCase(result,
   // (meaning there were no valid children that could be wrapped)
   var allContentBrokeOut = !hasCreatedContainer && result.length > 0;
   var shouldCreateEmptyTarget = isFromContainer && isTargetContainer && allContentBrokeOut;
-  if (shouldCreateEmptyTarget) {
-    var emptyParagraph = schema.nodes.paragraph.create();
-    var emptyContainer = targetNodeType.create({}, emptyParagraph);
-    return [emptyContainer].concat((0, _toConsumableArray2.default)(result));
+  if (!shouldCreateEmptyTarget) {
+    return result;
+  }
+  if (targetNodeTypeName === schema.nodes.codeBlock.name) {
+    var emptyCodeBlock = createTextContentContainer([], schema.nodes.codeBlock, schema);
+    return emptyCodeBlock ? [emptyCodeBlock].concat((0, _toConsumableArray2.default)(result)) : result;
   }
-  return result;
+  var emptyParagraph = schema.nodes.paragraph.create();
+  var emptyContainer = targetNodeType.create({}, emptyParagraph);
+  return [emptyContainer].concat((0, _toConsumableArray2.default)(result));
 };
 
 /**
@@ -57,6 +89,9 @@ var handleEmptyContainerEdgeCase = function handleEmptyContainerEdgeCase(result,
  * - Layouts always require layoutColumns as children (never paragraphs directly)
  * - Layout columns can contain most block content including headings, paragraphs, lists, etc.
  *
+ * Special handling for codeblocks:
+ * - Text nodes are converted to plain text and added to the codeblock
+ *
  * Edge case handling:
  * - For regular containers: If all content breaks out (container → container transform with no
  *   valid children), an empty container with a paragraph is created to ensure the target type exists
@@ -85,6 +120,7 @@ var wrapMixedContentStep = exports.wrapMixedContentStep = function wrapMixedCont
     return nodes;
   }
   var isLayout = targetNodeTypeName === 'layoutSection';
+  var isCodeblock = targetNodeTypeName === 'codeBlock';
   var _schema$nodes = schema.nodes,
     layoutSection = _schema$nodes.layoutSection,
     layoutColumn = _schema$nodes.layoutColumn;
@@ -95,64 +131,62 @@ var wrapMixedContentStep = exports.wrapMixedContentStep = function wrapMixedCont
     if (currentContainerContent.length === 0) {
       return;
     }
+    var container = null;
     if (isLayout) {
-      // For layouts, create layoutSection with two layoutColumns
-      var columnOne = layoutColumn.createAndFill({}, (0, _marks.removeDisallowedMarks)(currentContainerContent, layoutColumn));
-      var columnTwo = layoutColumn.createAndFill();
-      if (!columnOne || !columnTwo) {
-        currentContainerContent = [];
-        return;
-      }
-      var layout = layoutSection.createAndFill({}, [columnOne, columnTwo]);
-      if (layout) {
-        result.push(layout);
-        hasCreatedContainer = true;
-      }
-      currentContainerContent = [];
-      return;
+      container = createLayoutSection(currentContainerContent, layoutSection, layoutColumn);
+    } else if (isCodeblock) {
+      container = createTextContentContainer(currentContainerContent, targetNodeType, schema);
+    } else {
+      container = createNodeContentContainer(currentContainerContent, targetNodeType);
     }
-
-    // For regular containers, create directly
-    var containerNode = targetNodeType.createAndFill({}, currentContainerContent);
-    if (containerNode) {
-      result.push(containerNode);
+    if (container) {
+      result.push(container);
       hasCreatedContainer = true;
     }
     currentContainerContent = [];
   };
-  var processNode = function processNode(node) {
+  var canNodeBeWrapped = function canNodeBeWrapped(node) {
     var validationType = isLayout ? layoutColumn : targetNodeType;
-    var canWrapNode = validationType.validContent(_model.Fragment.from((0, _marks.removeDisallowedMarks)([node], validationType)));
-
-    // Node can be wrapped - add to current container content
-    if (canWrapNode) {
-      var _currentContainerCont;
-      // remove marks from node as nested nodes don't usually support block marks
-      (_currentContainerCont = currentContainerContent).push.apply(_currentContainerCont, (0, _toConsumableArray2.default)((0, _marks.removeDisallowedMarks)([node], validationType)));
+    return validationType.validContent(_model.Fragment.from((0, _marks.removeDisallowedMarks)([node], validationType)));
+  };
+  var handleWrappableNode = function handleWrappableNode(node) {
+    var _currentContainerCont;
+    var validationType = isLayout ? layoutColumn : targetNodeType;
+    (_currentContainerCont = currentContainerContent).push.apply(_currentContainerCont, (0, _toConsumableArray2.default)((0, _marks.removeDisallowedMarks)([node], validationType)));
+  };
+  var handleCodeblockTextNode = function handleCodeblockTextNode(node) {
+    currentContainerContent.push((0, _utils.createTextContent)(node));
+  };
+  var handleConvertibleTextNode = function handleConvertibleTextNode(node) {
+    var paragraph = (0, _utils.convertTextNodeToParagraph)(node, schema);
+    if (paragraph) {
+      currentContainerContent.push(paragraph);
+    }
+  };
+  var handleUnsupportedNode = function handleUnsupportedNode(node) {
+    flushCurrentContainer();
+    result.push(node);
+  };
+  var processNode = function processNode(node) {
+    if (canNodeBeWrapped(node)) {
+      handleWrappableNode(node);
+      return;
+    }
+    if ((0, _utils.isTextNode)(node) && isCodeblock) {
+      handleCodeblockTextNode(node);
       return;
     }
-
-    // Text node (heading, paragraph) that can't be wrapped - convert to paragraph
-    // Example: heading can't go in blockquote, so convert to paragraph with same content
     if ((0, _utils.isTextNode)(node)) {
-      var paragraph = (0, _utils.convertTextNodeToParagraph)(node, schema);
-      if (paragraph) {
-        currentContainerContent.push(paragraph);
-      }
+      handleConvertibleTextNode(node);
       return;
     }
 
     // All other nodes that cannot be wrapped in the target node - break out
     // Examples: same-type containers, tables in panels, layoutSections in layouts
-    flushCurrentContainer();
-    result.push(node);
+    handleUnsupportedNode(node);
   };
   nodes.forEach(processNode);
-
-  // Flush any remaining content into a container
   flushCurrentContainer();
-
-  // Skip edge case handling for layouts since layouts always have columns
   if (isLayout) {
     return result.length > 0 ? result : nodes;
   }

package/dist/cjs/editor-commands/transform-node-utils/transform.js

@@ -17,7 +17,6 @@ var _unwrapLayoutStep = require("./steps/unwrapLayoutStep");
 var _unwrapListStep = require("./steps/unwrapListStep");
 var _wrapBlockquoteToDecisionListStep = require("./steps/wrapBlockquoteToDecisionListStep");
 var _wrapMixedContentStep = require("./steps/wrapMixedContentStep");
-var _wrapTextToCodeblock = require("./steps/wrapTextToCodeblock");
 var _types = require("./types");
 var _unwrapExpandStep = require("./unwrapExpandStep");
 var _unwrapStep = require("./unwrapStep");
@@ -36,7 +35,7 @@ var TRANSFORM_STEPS = {
     atomic: undefined,
     container: [_unwrapStep.unwrapStep, _wrapStep.wrapStep],
     list: undefined,
-    text: [_unwrapStep.unwrapStep, _applyTargetTextTypeStep.applyTargetTextTypeStep],
+    text: [_unwrapStep.unwrapStep],
     multi: undefined
   },
   list: {
@@ -67,18 +66,13 @@ var TRANSFORM_STEPS = {
 // Use 'null' to indicate unavailable transfrorm for a case where TRANSFORM_STEPS are not undefined.
 var TRANSFORM_STEPS_OVERRIDE = {
   paragraph: {
-    paragraph: null,
-    codeBlock: [_wrapTextToCodeblock.wrapTextToCodeblockStep],
-    layoutSection: [_wrapMixedContentStep.wrapMixedContentStep]
-  },
-  heading: {
-    codeBlock: [_wrapTextToCodeblock.wrapTextToCodeblockStep],
-    layoutSection: [_wrapMixedContentStep.wrapMixedContentStep]
+    paragraph: null
   },
+  heading: {},
   panel: {
     panel: null,
     layoutSection: [_unwrapStep.unwrapStep, _wrapMixedContentStep.wrapMixedContentStep],
-    codeBlock: [_unwrapStep.unwrapStep, _flattenStep.flattenStep, _wrapStep.wrapStep],
+    codeBlock: [_unwrapStep.unwrapStep, _wrapMixedContentStep.wrapMixedContentStep],
     blockquote: [_unwrapStep.unwrapStep, _wrapMixedContentStep.wrapMixedContentStep],
     taskList: null,
     bulletList: null,
@@ -109,7 +103,9 @@ var TRANSFORM_STEPS_OVERRIDE = {
     nestedExpand: [_wrapStep.wrapStep],
     layoutSection: [_wrapMixedContentStep.wrapMixedContentStep],
     codeBlock: null,
-    decisionList: [_unwrapStep.unwrapStep, _wrapBlockquoteToDecisionListStep.wrapBlockquoteToDecisionListStep]
+    decisionList: [_unwrapStep.unwrapStep, _wrapBlockquoteToDecisionListStep.wrapBlockquoteToDecisionListStep],
+    paragraph: [_unwrapStep.unwrapStep],
+    heading: [_unwrapStep.unwrapStep, _applyTargetTextTypeStep.applyTargetTextTypeStep]
   },
   layoutSection: {
     layoutSection: null,
@@ -127,6 +123,7 @@ var TRANSFORM_STEPS_OVERRIDE = {
     nestedExpand: [_wrapStep.wrapStep],
     layoutSection: [_wrapMixedContentStep.wrapMixedContentStep],
     panel: [_wrapStep.wrapStep],
+    paragraph: [_applyTargetTextTypeStep.applyTargetTextTypeStep],
     heading: null
   },
   bulletList: {
@@ -180,7 +177,9 @@ var TRANSFORM_STEPS_OVERRIDE = {
     bulletList: [_decisionListToListStep.decisionListToListStep],
     orderedList: [_decisionListToListStep.decisionListToListStep],
     taskList: [_decisionListToListStep.decisionListToListStep],
-    layoutSection: [_wrapMixedContentStep.wrapMixedContentStep]
+    layoutSection: [_wrapMixedContentStep.wrapMixedContentStep],
+    blockquote: [_unwrapListStep.unwrapListStep, _wrapStep.wrapStep],
+    codeBlock: [_unwrapListStep.unwrapListStep, _wrapMixedContentStep.wrapMixedContentStep]
   },
   blockCard: {
     layoutSection: [_wrapMixedContentStep.wrapMixedContentStep],
@@ -221,10 +220,11 @@ var TRANSFORM_STEPS_OVERRIDE = {
     decisionList: null
   },
   multi: {
-    // TODO: EDITOR-4140 - Implement multiple paragraphs/headings/codeblocks to heading transform
-    heading: null,
-    // TODO: EDITOR-4141 - Implement multiple codeblocks/headings to paragraph transform
-    paragraph: null
+    heading: [_applyTargetTextTypeStep.applyTargetTextTypeStep]
+    // Similar to heading, all structures are kept as is
+    // EG: transformed: other lists, paragarph, headings
+    // eg: not-transformed: quotes, codeblocks ... all typeof 'containers'
+    // decisionList: [],
   }
 };
 var getTransformStepsForNodeTypes = function getTransformStepsForNodeTypes(selectedNodeTypeName, targetNodeTypeName) {

package/dist/cjs/editor-commands/transformNode.js

@@ -51,8 +51,14 @@ var transformNode = exports.transformNode = function transformNode(api) {
       });
       var content = resultNodes.length > 0 ? resultNodes : slice.content;
       if (preservedSelection instanceof _state.NodeSelection && preservedSelection.node.type === nodes.mediaSingle) {
-        tr.deleteRange($from.pos, $to.pos);
-        tr.insert($from.pos, content);
+        // when node is media single, use tr.replaceWith freeze editor, if modify position, tr.replaceWith creates duplicats
+        var deleteFrom = $from.pos;
+        var deleteTo = $to.pos;
+        tr.delete(deleteFrom, deleteTo);
+        // After deletion, recalculate the insertion position to ensure it's valid
+        // especially when mediaSingle with caption is at the bottom of the document
+        var insertPos = Math.min(deleteFrom, tr.doc.content.size);
+        tr.insert(insertPos, content);
       } else {
         tr.replaceWith(sliceStart, $to.pos, content);
       }

package/dist/es2019/editor-commands/transform-node-utils/flattenStep.js

@@ -10,14 +10,6 @@ export const flattenStep = (nodes, context) => {
   if (!targetNodeType || !paragraph) {
     return nodes;
   }
-
-  // TODO: EDITOR-2920 - Implement flattening logic.
-  const isTargetCodeBlock = targetNodeTypeName === 'codeBlock';
-  if (isTargetCodeBlock) {
-    // This strips explicitly text nodes
-    const codeBlockContent = nodes.map(node => node.content.textBetween(0, node.content.size, '\n')).join('\n');
-    return [schema.nodes.codeBlock.create({}, schema.text(codeBlockContent))];
-  }
   return nodes.map(node => {
     const isValidWithin = targetNodeType.validContent(node.content);
     if (!isValidWithin) {

package/dist/es2019/editor-commands/transform-node-utils/steps/applyTargetTextTypeStep.js

@@ -1,16 +1,19 @@
 /**
- * Applies target text type conversion. If the target type is a heading, converts textblock nodes
- * (paragraphs, headings) to heading nodes with the specified level. Otherwise, leaves nodes unchanged.
- * Non-textblock nodes are always left unchanged.
+ * Applies target text type conversion. Converts textblock nodes to the target text type
+ * (paragraph or heading). Non-textblock nodes are left unchanged.
  *
  * @example
  * Input:
- * - paragraph "Heading 1"
- * - paragraph "Heading 2"
+ * - paragraph "Text 1"
+ * - paragraph "Text 2"
  *
  * Output (with target: heading, level: 2):
- * - heading (level: 2) "Heading 1"
- * - heading (level: 2) "Heading 2"
+ * - heading (level: 2) "Text 1"
+ * - heading (level: 2) "Text 2"
+ *
+ * Output (with target: paragraph):
+ * - paragraph "Text 1"
+ * - paragraph "Text 2"
  *
  * @param nodes
  * @param context
@@ -22,23 +25,28 @@ export const applyTargetTextTypeStep = (nodes, context) => {
     targetNodeTypeName,
     targetAttrs
   } = context;
-  if (targetNodeTypeName !== 'heading') {
+  if (targetNodeTypeName !== 'heading' && targetNodeTypeName !== 'paragraph') {
     return nodes;
   }
-  const headingType = schema.nodes.heading;
-  if (!headingType) {
+  const targetType = schema.nodes[targetNodeTypeName];
+  if (!targetType) {
     return nodes;
   }
-
-  // Default to level 1 if no level is specified
-  // The level should ideally come from targetAttrs, but if not available, use default
-  const headingLevel = typeof (targetAttrs === null || targetAttrs === void 0 ? void 0 : targetAttrs.level) === 'number' ? targetAttrs.level : 1;
   return nodes.map(node => {
+    // If codeblock, return nodes as is
+    if (targetNodeTypeName === 'heading' && node.type.name === 'codeBlock') {
+      return node;
+    }
     if (node.isTextblock) {
-      // Convert textblock nodes (paragraphs, headings) to heading with specified level
-      return headingType.create({
-        level: headingLevel
-      }, node.content, node.marks);
+      // Convert textblock nodes to the target type with content preserved
+      let attrs = {};
+      if (targetNodeTypeName === 'heading') {
+        const level = typeof (targetAttrs === null || targetAttrs === void 0 ? void 0 : targetAttrs.level) === 'number' ? targetAttrs.level : 1;
+        attrs = {
+          level
+        };
+      }
+      return targetType.create(attrs, node.content, node.marks);
     }
     // Non-textblock nodes are left unchanged
     return node;

package/dist/es2019/editor-commands/transform-node-utils/steps/wrapMixedContentStep.js

@@ -1,7 +1,35 @@
 import { Fragment } from '@atlaskit/editor-prosemirror/model';
 import { removeDisallowedMarks } from '../marks';
 import { NODE_CATEGORY_BY_TYPE } from '../types';
-import { convertTextNodeToParagraph, isTextNode } from '../utils';
+import { convertTextNodeToParagraph, createTextContent, isTextNode } from '../utils';
+
+/**
+ * Creates a layout section with two columns, where the first column contains the provided content.
+ */
+const createLayoutSection = (content, layoutSection, layoutColumn) => {
+  const columnOne = layoutColumn.createAndFill({}, removeDisallowedMarks(content, layoutColumn));
+  const columnTwo = layoutColumn.createAndFill();
+  if (!columnOne || !columnTwo) {
+    return null;
+  }
+  return layoutSection.createAndFill({}, [columnOne, columnTwo]);
+};
+
+/**
+ * Creates a container with text content (for codeblocks).
+ */
+const createTextContentContainer = (textContentArray, targetNodeType, schema) => {
+  const textContent = textContentArray.join('\n');
+  const textNode = textContent ? schema.text(textContent) : null;
+  return targetNodeType.createAndFill({}, textNode);
+};
+
+/**
+ * Creates a regular container with node content.
+ */
+const createNodeContentContainer = (nodeContent, targetNodeType) => {
+  return targetNodeType.createAndFill({}, nodeContent);
+};
 
 /**
  * Handles the edge case where transforming from a container to another container results in
@@ -27,12 +55,16 @@ const handleEmptyContainerEdgeCase = (result, hasCreatedContainer, fromNode, tar
   // (meaning there were no valid children that could be wrapped)
   const allContentBrokeOut = !hasCreatedContainer && result.length > 0;
   const shouldCreateEmptyTarget = isFromContainer && isTargetContainer && allContentBrokeOut;
-  if (shouldCreateEmptyTarget) {
-    const emptyParagraph = schema.nodes.paragraph.create();
-    const emptyContainer = targetNodeType.create({}, emptyParagraph);
-    return [emptyContainer, ...result];
+  if (!shouldCreateEmptyTarget) {
+    return result;
+  }
+  if (targetNodeTypeName === schema.nodes.codeBlock.name) {
+    const emptyCodeBlock = createTextContentContainer([], schema.nodes.codeBlock, schema);
+    return emptyCodeBlock ? [emptyCodeBlock, ...result] : result;
   }
-  return result;
+  const emptyParagraph = schema.nodes.paragraph.create();
+  const emptyContainer = targetNodeType.create({}, emptyParagraph);
+  return [emptyContainer, ...result];
 };
 
 /**
@@ -50,6 +82,9 @@ const handleEmptyContainerEdgeCase = (result, hasCreatedContainer, fromNode, tar
  * - Layouts always require layoutColumns as children (never paragraphs directly)
  * - Layout columns can contain most block content including headings, paragraphs, lists, etc.
  *
+ * Special handling for codeblocks:
+ * - Text nodes are converted to plain text and added to the codeblock
+ *
  * Edge case handling:
  * - For regular containers: If all content breaks out (container → container transform with no
  *   valid children), an empty container with a paragraph is created to ensure the target type exists
@@ -80,6 +115,7 @@ export const wrapMixedContentStep = (nodes, context) => {
     return nodes;
   }
   const isLayout = targetNodeTypeName === 'layoutSection';
+  const isCodeblock = targetNodeTypeName === 'codeBlock';
   const {
     layoutSection,
     layoutColumn
@@ -91,63 +127,61 @@ export const wrapMixedContentStep = (nodes, context) => {
     if (currentContainerContent.length === 0) {
       return;
     }
+    let container = null;
     if (isLayout) {
-      // For layouts, create layoutSection with two layoutColumns
-      const columnOne = layoutColumn.createAndFill({}, removeDisallowedMarks(currentContainerContent, layoutColumn));
-      const columnTwo = layoutColumn.createAndFill();
-      if (!columnOne || !columnTwo) {
-        currentContainerContent = [];
-        return;
-      }
-      const layout = layoutSection.createAndFill({}, [columnOne, columnTwo]);
-      if (layout) {
-        result.push(layout);
-        hasCreatedContainer = true;
-      }
-      currentContainerContent = [];
-      return;
+      container = createLayoutSection(currentContainerContent, layoutSection, layoutColumn);
+    } else if (isCodeblock) {
+      container = createTextContentContainer(currentContainerContent, targetNodeType, schema);
+    } else {
+      container = createNodeContentContainer(currentContainerContent, targetNodeType);
     }
-
-    // For regular containers, create directly
-    const containerNode = targetNodeType.createAndFill({}, currentContainerContent);
-    if (containerNode) {
-      result.push(containerNode);
+    if (container) {
+      result.push(container);
       hasCreatedContainer = true;
     }
     currentContainerContent = [];
   };
-  const processNode = node => {
+  const canNodeBeWrapped = node => {
     const validationType = isLayout ? layoutColumn : targetNodeType;
-    const canWrapNode = validationType.validContent(Fragment.from(removeDisallowedMarks([node], validationType)));
-
-    // Node can be wrapped - add to current container content
-    if (canWrapNode) {
-      // remove marks from node as nested nodes don't usually support block marks
-      currentContainerContent.push(...removeDisallowedMarks([node], validationType));
+    return validationType.validContent(Fragment.from(removeDisallowedMarks([node], validationType)));
+  };
+  const handleWrappableNode = node => {
+    const validationType = isLayout ? layoutColumn : targetNodeType;
+    currentContainerContent.push(...removeDisallowedMarks([node], validationType));
+  };
+  const handleCodeblockTextNode = node => {
+    currentContainerContent.push(createTextContent(node));
+  };
+  const handleConvertibleTextNode = node => {
+    const paragraph = convertTextNodeToParagraph(node, schema);
+    if (paragraph) {
+      currentContainerContent.push(paragraph);
+    }
+  };
+  const handleUnsupportedNode = node => {
+    flushCurrentContainer();
+    result.push(node);
+  };
+  const processNode = node => {
+    if (canNodeBeWrapped(node)) {
+      handleWrappableNode(node);
+      return;
+    }
+    if (isTextNode(node) && isCodeblock) {
+      handleCodeblockTextNode(node);
       return;
     }
-
-    // Text node (heading, paragraph) that can't be wrapped - convert to paragraph
-    // Example: heading can't go in blockquote, so convert to paragraph with same content
     if (isTextNode(node)) {
-      const paragraph = convertTextNodeToParagraph(node, schema);
-      if (paragraph) {
-        currentContainerContent.push(paragraph);
-      }
+      handleConvertibleTextNode(node);
       return;
     }
 
     // All other nodes that cannot be wrapped in the target node - break out
     // Examples: same-type containers, tables in panels, layoutSections in layouts
-    flushCurrentContainer();
-    result.push(node);
+    handleUnsupportedNode(node);
   };
   nodes.forEach(processNode);
-
-  // Flush any remaining content into a container
   flushCurrentContainer();
-
-  // Skip edge case handling for layouts since layouts always have columns
   if (isLayout) {
     return result.length > 0 ? result : nodes;
   }