@atlaskit/editor-plugin-code-block 0.1.0

package/dist/es2019/pm-plugins/ide-ux.js

@@ -0,0 +1,135 @@
+import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
+import { filterCommand as filter } from '@atlaskit/editor-common/utils';
+import { keydownHandler } from '@atlaskit/editor-prosemirror/keymap';
+import { TextSelection } from '@atlaskit/editor-prosemirror/state';
+import { setTextSelection } from '@atlaskit/editor-prosemirror/utils';
+import { getAutoClosingBracketInfo, shouldAutoCloseBracket } from '../ide-ux/bracket-handling';
+import { indent, insertIndent, insertNewlineWithIndent, outdent } from '../ide-ux/commands';
+import { getEndOfCurrentLine, getLineInfo, getStartOfCurrentLine, isCursorInsideCodeBlock, isSelectionEntirelyInsideCodeBlock } from '../ide-ux/line-handling';
+import { isClosingCharacter, isCursorBeforeClosingCharacter } from '../ide-ux/paired-character-handling';
+import { getAutoClosingQuoteInfo, shouldAutoCloseQuote } from '../ide-ux/quote-handling';
+import { getCursor } from '../utils';
+const ideUX = pluginInjectionApi => {
+  var _pluginInjectionApi$a;
+  const editorAnalyticsAPI = pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$a = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a === void 0 ? void 0 : _pluginInjectionApi$a.actions;
+  return new SafePlugin({
+    props: {
+      handleTextInput(view, from, to, text) {
+        var _pluginInjectionApi$c;
+        const {
+          state,
+          dispatch
+        } = view;
+        const compositionPluginState = pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$c = pluginInjectionApi.composition) === null || _pluginInjectionApi$c === void 0 ? void 0 : _pluginInjectionApi$c.sharedState.currentState();
+        if (isCursorInsideCodeBlock(state) && !(compositionPluginState !== null && compositionPluginState !== void 0 && compositionPluginState.isComposing)) {
+          const beforeText = getStartOfCurrentLine(state).text;
+          const afterText = getEndOfCurrentLine(state).text;
+
+          // If text is a closing bracket/quote and we've already inserted it, move the selection after
+          if (isCursorBeforeClosingCharacter(afterText) && isClosingCharacter(text) && afterText.startsWith(text)) {
+            dispatch(setTextSelection(to + text.length)(state.tr));
+            return true;
+          }
+
+          // Automatically add right-hand side bracket when user types the left bracket
+          if (shouldAutoCloseBracket(beforeText, afterText)) {
+            const {
+              left,
+              right
+            } = getAutoClosingBracketInfo(beforeText + text, afterText);
+            if (left && right) {
+              const bracketPair = state.schema.text(text + right);
+              let tr = state.tr.replaceWith(from, to, bracketPair);
+              dispatch(setTextSelection(from + text.length)(tr));
+              return true;
+            }
+          }
+
+          // Automatically add closing quote when user types a starting quote
+          if (shouldAutoCloseQuote(beforeText, afterText)) {
+            const {
+              left: leftQuote,
+              right: rightQuote
+            } = getAutoClosingQuoteInfo(beforeText + text, afterText);
+            if (leftQuote && rightQuote) {
+              const quotePair = state.schema.text(text + rightQuote);
+              let tr = state.tr.replaceWith(from, to, quotePair);
+              dispatch(setTextSelection(from + text.length)(tr));
+              return true;
+            }
+          }
+        }
+        return false;
+      },
+      handleKeyDown: keydownHandler({
+        Backspace: (state, dispatch) => {
+          if (isCursorInsideCodeBlock(state)) {
+            const $cursor = getCursor(state.selection);
+            const beforeText = getStartOfCurrentLine(state).text;
+            const afterText = getEndOfCurrentLine(state).text;
+            const {
+              left: leftBracket,
+              right: rightBracket,
+              hasTrailingMatchingBracket
+            } = getAutoClosingBracketInfo(beforeText, afterText);
+            if (leftBracket && rightBracket && hasTrailingMatchingBracket && dispatch) {
+              dispatch(state.tr.delete($cursor.pos - leftBracket.length, $cursor.pos + rightBracket.length));
+              return true;
+            }
+            const {
+              left: leftQuote,
+              right: rightQuote,
+              hasTrailingMatchingQuote
+            } = getAutoClosingQuoteInfo(beforeText, afterText);
+            if (leftQuote && rightQuote && hasTrailingMatchingQuote && dispatch) {
+              dispatch(state.tr.delete($cursor.pos - leftQuote.length, $cursor.pos + rightQuote.length));
+              return true;
+            }
+            const {
+              indentToken: {
+                size,
+                token
+              },
+              indentText
+            } = getLineInfo(beforeText);
+            if (beforeText === indentText) {
+              if (indentText.endsWith(token.repeat(size)) && dispatch) {
+                dispatch(state.tr.delete($cursor.pos - (size - indentText.length % size || size), $cursor.pos));
+                return true;
+              }
+            }
+          }
+          return false;
+        },
+        Enter: filter(isSelectionEntirelyInsideCodeBlock, insertNewlineWithIndent),
+        'Mod-]': filter(isSelectionEntirelyInsideCodeBlock, indent(editorAnalyticsAPI)),
+        'Mod-[': filter(isSelectionEntirelyInsideCodeBlock, outdent(editorAnalyticsAPI)),
+        Tab: filter(isSelectionEntirelyInsideCodeBlock, (state, dispatch) => {
+          if (!dispatch) {
+            return false;
+          }
+          if (isCursorInsideCodeBlock(state)) {
+            return insertIndent(state, dispatch);
+          }
+          return indent(editorAnalyticsAPI)(state, dispatch);
+        }),
+        'Shift-Tab': filter(isSelectionEntirelyInsideCodeBlock, outdent(editorAnalyticsAPI)),
+        'Mod-a': (state, dispatch) => {
+          if (isSelectionEntirelyInsideCodeBlock(state)) {
+            const {
+              $from,
+              $to
+            } = state.selection;
+            const isFullCodeBlockSelection = $from.parentOffset === 0 && $to.parentOffset === $to.parent.nodeSize - 2;
+            if (!isFullCodeBlockSelection && dispatch) {
+              dispatch(state.tr.setSelection(TextSelection.create(state.doc, $from.start(), $to.end())));
+              return true;
+            }
+          }
+          return false;
+        }
+      })
+    }
+  });
+};
+export default ideUX;

package/dist/es2019/pm-plugins/input-rule.js

@@ -0,0 +1,60 @@
+import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE, INPUT_METHOD } from '@atlaskit/editor-common/analytics';
+import { insertBlock } from '@atlaskit/editor-common/commands';
+import { inputRuleWithAnalytics } from '@atlaskit/editor-common/utils';
+import { safeInsert } from '@atlaskit/editor-prosemirror/utils';
+import { createPlugin, createRule, leafNodeReplacementCharacter } from '@atlaskit/prosemirror-input-rules';
+import { isConvertableToCodeBlock, transformToCodeBlockAction } from '../transform-to-code-block';
+export function createCodeBlockInputRule(schema, editorAnalyticsAPI) {
+  const rules = getCodeBlockRules(editorAnalyticsAPI, schema);
+  return createPlugin('code-block-input-rule', rules, {
+    isBlockNodeRule: true
+  });
+}
+
+/**
+ * Get all code block input rules
+ *
+ * @param {Schema} schema
+ * @returns {InputRuleWithHandler[]}
+ */
+function getCodeBlockRules(editorAnalyticsAPI, schema) {
+  const ruleAnalytics = inputRuleWithAnalytics({
+    action: ACTION.INSERTED,
+    actionSubject: ACTION_SUBJECT.DOCUMENT,
+    actionSubjectId: ACTION_SUBJECT_ID.CODE_BLOCK,
+    attributes: {
+      inputMethod: INPUT_METHOD.FORMATTING
+    },
+    eventType: EVENT_TYPE.TRACK
+  }, editorAnalyticsAPI);
+  const validMatchLength = match => match.length > 0 && match[0].length === 3;
+  const threeTildeRule = createRule(/(?!\s)(`{3,})$/, (state, match, start, end) => {
+    if (!validMatchLength(match)) {
+      return null;
+    }
+    const attributes = {};
+    if (match[4]) {
+      attributes.language = match[4];
+    }
+    if (isConvertableToCodeBlock(state)) {
+      return transformToCodeBlockAction(state, start, attributes);
+    }
+    const tr = state.tr;
+    tr.delete(start, end);
+    const codeBlock = tr.doc.type.schema.nodes.codeBlock.createChecked();
+    safeInsert(codeBlock)(tr);
+    return tr;
+  });
+  const leftNodeReplacementThreeTildeRule = createRule(new RegExp(`((${leafNodeReplacementCharacter}\`{3,})|^\\s(\`{3,}))(\\S*)$`), (state, match, start, end) => {
+    if (!validMatchLength(match)) {
+      return null;
+    }
+    const attributes = {};
+    if (match[4]) {
+      attributes.language = match[4];
+    }
+    const inlineStart = Math.max(match.index + state.selection.$from.start(), 1);
+    return insertBlock(state, schema.nodes.codeBlock, inlineStart, end, attributes);
+  });
+  return [ruleAnalytics(threeTildeRule), ruleAnalytics(leftNodeReplacementThreeTildeRule)];
+}

package/dist/es2019/pm-plugins/keymaps.js

@@ -0,0 +1,58 @@
+import { isEmptyNode } from '@atlaskit/editor-common/utils';
+import { keymap } from '@atlaskit/editor-prosemirror/keymap';
+import { Selection } from '@atlaskit/editor-prosemirror/state';
+import { findParentNodeOfTypeClosestToPos, hasParentNodeOfType } from '@atlaskit/editor-prosemirror/utils';
+import { getCursor } from '../utils';
+const deleteCurrentItem = $from => tr => {
+  return tr.delete($from.before($from.depth), $from.after($from.depth));
+};
+const setTextSelection = pos => tr => {
+  const newSelection = Selection.findFrom(tr.doc.resolve(pos), -1, true);
+  if (newSelection) {
+    tr.setSelection(newSelection);
+  }
+  return tr;
+};
+export function keymapPlugin(schema) {
+  return keymap({
+    Backspace: (state, dispatch) => {
+      const $cursor = getCursor(state.selection);
+      const {
+        paragraph,
+        codeBlock,
+        listItem,
+        table,
+        layoutColumn
+      } = state.schema.nodes;
+      if (!$cursor || $cursor.parent.type !== codeBlock || !dispatch) {
+        return false;
+      }
+      if ($cursor.pos === 1 || hasParentNodeOfType(listItem)(state.selection) && $cursor.parentOffset === 0) {
+        const node = findParentNodeOfTypeClosestToPos($cursor, codeBlock);
+        if (!node) {
+          return false;
+        }
+        dispatch(state.tr.setNodeMarkup(node.pos, node.node.type, node.node.attrs, []).setBlockType($cursor.pos, $cursor.pos, paragraph));
+        return true;
+      }
+      if ($cursor.node && isEmptyNode(schema)($cursor.node()) && (hasParentNodeOfType(layoutColumn)(state.selection) || hasParentNodeOfType(table)(state.selection))) {
+        const {
+          tr
+        } = state;
+        const insertPos = $cursor.pos;
+        deleteCurrentItem($cursor)(tr);
+        setTextSelection(insertPos)(tr);
+        dispatch(tr.scrollIntoView());
+        return true;
+      }
+
+      // Handle not nested empty code block
+      if (isEmptyNode(schema)($cursor.node())) {
+        dispatch(deleteCurrentItem($cursor)(state === null || state === void 0 ? void 0 : state.tr));
+        return true;
+      }
+      return false;
+    }
+  });
+}
+export default keymapPlugin;

package/dist/es2019/pm-plugins/main-state.js

@@ -0,0 +1,2 @@
+import { pluginKey } from '../plugin-key';
+export const getPluginState = state => pluginKey.getState(state);

package/dist/es2019/pm-plugins/main.js

@@ -0,0 +1,102 @@
+import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
+import { createSelectionClickHandler } from '@atlaskit/editor-common/selection';
+import { browser } from '@atlaskit/editor-common/utils';
+import { NodeSelection } from '@atlaskit/editor-prosemirror/state';
+import { ignoreFollowingMutations, resetShouldIgnoreFollowingMutations } from '../actions';
+import { codeBlockNodeView } from '../nodeviews/code-block';
+import { pluginKey } from '../plugin-key';
+import { codeBlockClassNames } from '../ui/class-names';
+import { findCodeBlock } from '../utils';
+import { ACTIONS } from './actions';
+export const createPlugin = ({
+  useLongPressSelection = false,
+  getIntl,
+  appearance,
+  allowCompositionInputOverride = false
+}) => {
+  const handleDOMEvents = {};
+
+  // ME-1599: Composition on mobile was causing the DOM observer to mutate the code block
+  // incorrecly and lose content when pressing enter in the middle of a code block line.
+  if (allowCompositionInputOverride) {
+    handleDOMEvents.beforeinput = (view, event) => {
+      const keyEvent = event;
+      const eventInputType = keyEvent.inputType;
+      const eventText = keyEvent.data;
+      if (browser.ios && event.composed &&
+      // insertParagraph will be the input type when the enter key is pressed.
+      eventInputType === 'insertParagraph' && findCodeBlock(view.state, view.state.selection)) {
+        event.preventDefault();
+        return true;
+      } else if (browser.android && event.composed && eventInputType === 'insertCompositionText' && eventText[(eventText === null || eventText === void 0 ? void 0 : eventText.length) - 1] === '\n' && findCodeBlock(view.state, view.state.selection)) {
+        const resultingText = event.target.outerText + '\n';
+        if (resultingText.endsWith(eventText)) {
+          // End of paragraph
+          setTimeout(() => {
+            view.someProp('handleKeyDown', f => f(view, new KeyboardEvent('keydown', {
+              bubbles: true,
+              cancelable: true,
+              key: 'Enter',
+              code: 'Enter'
+            })));
+          }, 0);
+        } else {
+          // Middle of paragraph, end of line
+          ignoreFollowingMutations(view.state, view.dispatch);
+        }
+        return true;
+      }
+      if (browser.android) {
+        resetShouldIgnoreFollowingMutations(view.state, view.dispatch);
+      }
+      return false;
+    };
+  }
+  return new SafePlugin({
+    state: {
+      init(_, state) {
+        const node = findCodeBlock(state, state.selection);
+        return {
+          pos: node ? node.pos : null,
+          contentCopied: false,
+          isNodeSelected: false,
+          shouldIgnoreFollowingMutations: false
+        };
+      },
+      apply(tr, pluginState, _oldState, newState) {
+        if (tr.docChanged || tr.selectionSet) {
+          const node = findCodeBlock(newState, tr.selection);
+          const newPluginState = {
+            ...pluginState,
+            pos: node ? node.pos : null,
+            isNodeSelected: tr.selection instanceof NodeSelection
+          };
+          return newPluginState;
+        }
+        const meta = tr.getMeta(pluginKey);
+        if ((meta === null || meta === void 0 ? void 0 : meta.type) === ACTIONS.SET_COPIED_TO_CLIPBOARD) {
+          return {
+            ...pluginState,
+            contentCopied: meta.data
+          };
+        } else if ((meta === null || meta === void 0 ? void 0 : meta.type) === ACTIONS.SET_SHOULD_IGNORE_FOLLOWING_MUTATIONS) {
+          return {
+            ...pluginState,
+            shouldIgnoreFollowingMutations: meta.data
+          };
+        }
+        return pluginState;
+      }
+    },
+    key: pluginKey,
+    props: {
+      nodeViews: {
+        codeBlock: codeBlockNodeView
+      },
+      handleClickOn: createSelectionClickHandler(['codeBlock'], target => !!(target.closest(`.${codeBlockClassNames.gutter}`) || target.classList.contains(codeBlockClassNames.content)), {
+        useLongPressSelection
+      }),
+      handleDOMEvents
+    }
+  });
+};

package/dist/es2019/refresh-browser-selection.js

@@ -0,0 +1,25 @@
+import { browser } from '@atlaskit/editor-common/utils';
+import { pluginKey } from './plugin-key';
+
+// Workaround for a firefox issue where dom selection is off sync
+// https://product-fabric.atlassian.net/browse/ED-12442
+const refreshBrowserSelection = () => {
+  const domSelection = window.getSelection();
+  if (domSelection) {
+    const domRange = domSelection && domSelection.rangeCount === 1 && domSelection.getRangeAt(0).cloneRange();
+    if (domRange) {
+      domSelection.removeAllRanges();
+      domSelection.addRange(domRange);
+    }
+  }
+};
+const refreshBrowserSelectionOnChange = (transaction, editorState) => {
+  var _pluginKey$getState;
+  if (browser.gecko && transaction.docChanged &&
+  // codeblockState.pos should be set if current selection is in a codeblock.
+  typeof ((_pluginKey$getState = pluginKey.getState(editorState)) === null || _pluginKey$getState === void 0 ? void 0 : _pluginKey$getState.pos) === 'number') {
+    refreshBrowserSelection();
+  }
+};
+export default refreshBrowserSelectionOnChange;
+export { refreshBrowserSelection };

package/dist/es2019/toolbar.js

@@ -0,0 +1,108 @@
+import { defineMessages } from 'react-intl-next';
+import commonMessages, { codeBlockButtonMessages } from '@atlaskit/editor-common/messages';
+import { findDomRefAtPos } from '@atlaskit/editor-prosemirror/utils';
+import CopyIcon from '@atlaskit/icon/glyph/copy';
+import RemoveIcon from '@atlaskit/icon/glyph/editor/remove';
+import { changeLanguage, copyContentToClipboard, removeCodeBlock, resetCopiedState } from './actions';
+import { createLanguageList, DEFAULT_LANGUAGES, getLanguageIdentifier } from './language-list';
+import { pluginKey } from './plugin-key';
+import { provideVisualFeedbackForCopyButton, removeVisualFeedbackForCopyButton } from './pm-plugins/codeBlockCopySelectionPlugin';
+export const messages = defineMessages({
+  selectLanguage: {
+    id: 'fabric.editor.selectLanguage',
+    defaultMessage: 'Select language',
+    description: 'Code blocks display software code. A prompt to select the software language the code is written in.'
+  }
+});
+const languageList = createLanguageList(DEFAULT_LANGUAGES);
+export const getToolbarConfig = (allowCopyToClipboard = false, api) => (state, {
+  formatMessage
+}) => {
+  var _api$decorations$acti, _api$analytics, _codeBlockState$pos, _node$attrs;
+  const {
+    hoverDecoration
+  } = (_api$decorations$acti = api === null || api === void 0 ? void 0 : api.decorations.actions) !== null && _api$decorations$acti !== void 0 ? _api$decorations$acti : {};
+  const editorAnalyticsAPI = api === null || api === void 0 ? void 0 : (_api$analytics = api.analytics) === null || _api$analytics === void 0 ? void 0 : _api$analytics.actions;
+  const codeBlockState = pluginKey.getState(state);
+  const pos = (_codeBlockState$pos = codeBlockState === null || codeBlockState === void 0 ? void 0 : codeBlockState.pos) !== null && _codeBlockState$pos !== void 0 ? _codeBlockState$pos : null;
+  if (!codeBlockState || pos === null) {
+    return;
+  }
+  const node = state.doc.nodeAt(pos);
+  const nodeType = state.schema.nodes.codeBlock;
+  if ((node === null || node === void 0 ? void 0 : node.type) !== nodeType) {
+    return;
+  }
+  const language = node === null || node === void 0 ? void 0 : (_node$attrs = node.attrs) === null || _node$attrs === void 0 ? void 0 : _node$attrs.language;
+  const options = languageList.map(lang => ({
+    label: lang.name,
+    value: getLanguageIdentifier(lang),
+    alias: lang.alias
+  }));
+
+  // If language is not undefined search for it in the value and then search in the aliases
+  const defaultValue = language ? options.find(option => option.value === language) || options.find(option => option.alias.includes(language)) : null;
+  const languageSelect = {
+    id: 'editor.codeBlock.languageOptions',
+    type: 'select',
+    selectType: 'list',
+    onChange: option => changeLanguage(editorAnalyticsAPI)(option.value),
+    defaultValue,
+    placeholder: formatMessage(messages.selectLanguage),
+    options,
+    filterOption: languageListFilter
+  };
+  const separator = {
+    type: 'separator'
+  };
+  const copyToClipboardItems = !allowCopyToClipboard ? [] : [{
+    id: 'editor.codeBlock.copy',
+    type: 'button',
+    appearance: 'subtle',
+    icon: CopyIcon,
+    // note: copyContentToClipboard contains logic that also removes the
+    // visual feedback for the copy button
+    onClick: copyContentToClipboard,
+    title: formatMessage(codeBlockState.contentCopied ? codeBlockButtonMessages.copiedCodeToClipboard : codeBlockButtonMessages.copyCodeToClipboard),
+    onMouseEnter: provideVisualFeedbackForCopyButton,
+    // note: resetCopiedState contains logic that also removes the
+    // visual feedback for the copy button
+    onMouseLeave: resetCopiedState,
+    onFocus: provideVisualFeedbackForCopyButton,
+    onBlur: removeVisualFeedbackForCopyButton,
+    hideTooltipOnClick: false,
+    disabled: codeBlockState.isNodeSelected,
+    tabIndex: null
+  }, separator];
+  const deleteButton = {
+    id: 'editor.codeBlock.delete',
+    type: 'button',
+    appearance: 'danger',
+    icon: RemoveIcon,
+    onMouseEnter: hoverDecoration === null || hoverDecoration === void 0 ? void 0 : hoverDecoration(nodeType, true),
+    onMouseLeave: hoverDecoration === null || hoverDecoration === void 0 ? void 0 : hoverDecoration(nodeType, false),
+    onFocus: hoverDecoration === null || hoverDecoration === void 0 ? void 0 : hoverDecoration(nodeType, true),
+    onBlur: hoverDecoration === null || hoverDecoration === void 0 ? void 0 : hoverDecoration(nodeType, false),
+    onClick: removeCodeBlock,
+    title: formatMessage(commonMessages.remove),
+    tabIndex: null
+  };
+  return {
+    title: 'CodeBlock floating controls',
+    getDomRef: view => findDomRefAtPos(pos, view.domAtPos.bind(view)),
+    nodeType,
+    items: [languageSelect, separator, ...copyToClipboardItems, deleteButton],
+    scrollable: true
+  };
+};
+
+/**
+ * Filters language list based on both name and alias properties.
+ */
+export const languageListFilter = (option, rawInput) => {
+  const {
+    data
+  } = option;
+  const searchString = rawInput.toLowerCase();
+  return data.label.toLowerCase().includes(searchString) || data.alias.some(alias => alias.toLowerCase() === searchString);
+};

package/dist/es2019/transform-to-code-block.js

@@ -0,0 +1,79 @@
+import { GapCursorSelection } from '@atlaskit/editor-common/selection';
+import { mapSlice, timestampToString } from '@atlaskit/editor-common/utils';
+import { Fragment } from '@atlaskit/editor-prosemirror/model';
+import { TextSelection } from '@atlaskit/editor-prosemirror/state';
+export function transformToCodeBlockAction(state, start, attrs) {
+  const startOfCodeBlockText = state.selection.$from;
+  const endPosition = state.selection.empty && !(state.selection instanceof GapCursorSelection) ? startOfCodeBlockText.end() : state.selection.$to.pos;
+  const startLinePosition = startOfCodeBlockText.start();
+  //when cmd+A is used to select the content. start position should be 0.
+  const parentStartPosition = startOfCodeBlockText.depth === 0 ? 0 : startOfCodeBlockText.before();
+  const contentSlice = state.doc.slice(startOfCodeBlockText.pos, endPosition);
+  const codeBlockSlice = mapSlice(contentSlice, (node, parent, index) => {
+    if (node.type === state.schema.nodes.hardBreak) {
+      return state.schema.text('\n');
+    }
+    if (node.isText) {
+      return node.mark([]);
+    }
+    if (node.isInline) {
+      // Convert dates
+      if (node.attrs.timestamp) {
+        return state.schema.text(timestampToString(node.attrs.timestamp, null));
+      }
+      // Convert links
+      if (node.attrs.url) {
+        return state.schema.text(node.attrs.url);
+      }
+      return node.attrs.text ? state.schema.text(node.attrs.text) : null;
+    }
+
+    // if the current node is the last child of the Slice exit early to prevent
+    // adding additional line breaks
+    if (contentSlice.content.childCount - 1 === index) {
+      return node.content;
+    }
+
+    //useful to decide whether to append line breaks when the content has list items.
+    const isParentLastChild = parent && contentSlice.content.childCount - 1 === index;
+
+    // add line breaks at the end of each paragraph to mimic layout of selected content
+    // do not add line breaks when the 'paragraph' parent is last child.
+    if (node.content.childCount && node.type === state.schema.nodes.paragraph && !isParentLastChild) {
+      return node.content.append(Fragment.from(state.schema.text('\n\n')));
+    }
+    return node.content.childCount ? node.content : null;
+  });
+  const tr = state.tr;
+
+  // Replace current block node
+  const startMapped = startLinePosition === start ? parentStartPosition : start;
+  const codeBlock = state.schema.nodes.codeBlock;
+  const codeBlockNode = codeBlock.createChecked(attrs, codeBlockSlice.content);
+  tr.replaceWith(startMapped, Math.min(endPosition, tr.doc.content.size), codeBlockNode);
+
+  // Reposition cursor when inserting into layouts or table headers
+  const mapped = tr.doc.resolve(tr.mapping.map(startMapped) + 1);
+  const selection = TextSelection.findFrom(mapped, state.selection instanceof GapCursorSelection ? -1 : 1, true);
+  if (selection) {
+    return tr.setSelection(selection);
+  }
+  return tr.setSelection(TextSelection.create(tr.doc, Math.min(start + startOfCodeBlockText.node().nodeSize - 1, tr.doc.content.size)));
+}
+export function isConvertableToCodeBlock(state) {
+  // Before a document is loaded, there is no selection.
+  if (!state.selection) {
+    return false;
+  }
+  const {
+    $from
+  } = state.selection;
+  const node = $from.parent;
+  if (!node.isTextblock || node.type === state.schema.nodes.codeBlock) {
+    return false;
+  }
+  const parentDepth = $from.depth - 1;
+  const parentNode = $from.node(parentDepth);
+  const index = $from.index(parentDepth);
+  return parentNode.canReplaceWith(index, index + 1, state.schema.nodes.codeBlock);
+}

package/dist/es2019/types.js

@@ -0,0 +1 @@
+export {};

package/dist/es2019/ui/class-names.js

@@ -0,0 +1,9 @@
+import { CodeBlockSharedCssClassName } from '@atlaskit/editor-common/styles';
+export const codeBlockClassNames = {
+  container: CodeBlockSharedCssClassName.CODEBLOCK_CONTAINER,
+  start: CodeBlockSharedCssClassName.CODEBLOCK_START,
+  end: CodeBlockSharedCssClassName.CODEBLOCK_END,
+  contentWrapper: CodeBlockSharedCssClassName.CODEBLOCK_CONTENT_WRAPPER,
+  gutter: CodeBlockSharedCssClassName.CODEBLOCK_LINE_NUMBER_GUTTER,
+  content: CodeBlockSharedCssClassName.CODEBLOCK_CONTENT
+};

package/dist/es2019/utils.js

@@ -0,0 +1,4 @@
+export { findCodeBlock, transformSliceToJoinAdjacentCodeBlocks, transformSingleLineCodeBlockToCodeMark } from '@atlaskit/editor-common/transforms';
+export function getCursor(selection) {
+  return selection.$cursor || undefined;
+}