@atlaskit/editor-plugin-code-block 12.1.10 → 13.0.0

package/dist/esm/editor-commands/index.js

@@ -12,9 +12,11 @@ import { NodeSelection } from '@atlaskit/editor-prosemirror/state';
 import { findParentNodeOfType, findSelectedNodeOfType, isNodeSelection, removeParentNodeOfType, removeSelectedNode, safeInsert } from '@atlaskit/editor-prosemirror/utils';
 import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
 import { ACTIONS } from '../pm-plugins/actions';
+import { autoDetectPluginKey } from '../pm-plugins/auto-detect-state';
 import { copySelectionPluginKey } from '../pm-plugins/codeBlockCopySelectionPlugin';
 import { pluginKey } from '../pm-plugins/plugin-key';
 import { transformToCodeBlockAction } from '../pm-plugins/transform-to-code-block';
+import { createAutoDetectEntry, getLocalId, hasEnoughTextForAutoDetection } from '../utils/auto-detect-state';
 export var removeCodeBlockWithAnalytics = function removeCodeBlockWithAnalytics(editorAnalyticsAPI) {
   return withAnalytics(editorAnalyticsAPI, {
     action: ACTION.DELETED,
@@ -42,27 +44,40 @@ export var removeCodeBlock = function removeCodeBlock(state, dispatch) {
 export var changeLanguage = function changeLanguage(editorAnalyticsAPI) {
   return function (language, selectionSource) {
     return function (state, dispatch) {
-      var _pluginKey$getState;
+      var _pluginKey$getState, _autoDetectPluginKey$;
       var codeBlock = state.schema.nodes.codeBlock;
       var pos = (_pluginKey$getState = pluginKey.getState(state)) === null || _pluginKey$getState === void 0 ? void 0 : _pluginKey$getState.pos;
       if (typeof pos !== 'number') {
         return false;
       }
       var node = state.doc.nodeAt(pos);
+      var localId = node === null || node === void 0 ? void 0 : node.attrs.localId;
+      var previousAutoDetectEntry = expValEquals('platform_editor_code_block_auto_detection', 'isEnabled', true) ? (_autoDetectPluginKey$ = autoDetectPluginKey.getState(state)) === null || _autoDetectPluginKey$ === void 0 ? void 0 : _autoDetectPluginKey$.languageDetectionMap[localId] : undefined;
       var tr = state.tr.setNodeMarkup(pos, codeBlock, _objectSpread(_objectSpread({}, node === null || node === void 0 ? void 0 : node.attrs), {}, {
         language: language
       })).setMeta('scrollIntoView', false);
+      if (expValEquals('platform_editor_code_block_auto_detection', 'isEnabled', true)) {
+        tr.setMeta(autoDetectPluginKey, {
+          type: ACTIONS.REMOVE_AUTO_DETECT_ENTRY,
+          data: {
+            localId: localId
+          }
+        });
+      }
       var selection = isNodeSelection(state.selection) ? NodeSelection.create(tr.doc, pos) : tr.selection;
       var result = tr.setSelection(selection);
       if (dispatch) {
         editorAnalyticsAPI === null || editorAnalyticsAPI === void 0 || editorAnalyticsAPI.attachAnalyticsEvent({
           action: ACTION.LANGUAGE_SELECTED,
           actionSubject: ACTION_SUBJECT.CODE_BLOCK,
-          attributes: _objectSpread({
+          attributes: _objectSpread(_objectSpread({
             language: language !== null && language !== void 0 ? language : 'none'
           }, selectionSource ? {
             selectionSource: selectionSource
-          } : {}),
+          } : {}), {}, {
+            autoDetectionResult: previousAutoDetectEntry === null || previousAutoDetectEntry === void 0 ? void 0 : previousAutoDetectEntry.detectionResult,
+            autoDetectedLanguage: previousAutoDetectEntry === null || previousAutoDetectEntry === void 0 ? void 0 : previousAutoDetectEntry.autoDetectedLanguage
+          }),
           eventType: EVENT_TYPE.TRACK
         })(result);
         dispatch(result);
@@ -71,6 +86,43 @@ export var changeLanguage = function changeLanguage(editorAnalyticsAPI) {
     };
   };
 };
+
+/** Queue auto-detection for selected code block. */
+export var detectLanguage = function detectLanguage() {
+  return function (state, dispatch) {
+    var _pluginKey$getState2;
+    var pos = (_pluginKey$getState2 = pluginKey.getState(state)) === null || _pluginKey$getState2 === void 0 ? void 0 : _pluginKey$getState2.pos;
+    if (typeof pos !== 'number') {
+      return false;
+    }
+    var node = state.doc.nodeAt(pos);
+    if (!node) {
+      return false;
+    }
+    var localId = getLocalId(node);
+    if (!localId) {
+      return false;
+    }
+    var autoDetectState = autoDetectPluginKey.getState(state);
+    var previousEntry = autoDetectState === null || autoDetectState === void 0 ? void 0 : autoDetectState.languageDetectionMap[localId];
+    var entry = createAutoDetectEntry(node, pos, hasEnoughTextForAutoDetection(node.textContent), previousEntry);
+    var tr = state.tr.setNodeMarkup(pos, state.schema.nodes.codeBlock, _objectSpread(_objectSpread({}, node.attrs), {}, {
+      language: null
+    })).setMeta(autoDetectPluginKey, {
+      type: ACTIONS.SET_AUTO_DETECT_ENTRY,
+      data: {
+        localId: localId,
+        entry: entry
+      }
+    }).setMeta('scrollIntoView', false);
+    var selection = isNodeSelection(state.selection) ? NodeSelection.create(tr.doc, pos) : tr.selection;
+    var result = tr.setSelection(selection);
+    if (dispatch) {
+      dispatch(result);
+    }
+    return true;
+  };
+};
 export var copyContentToClipboardWithAnalytics = function copyContentToClipboardWithAnalytics(editorAnalyticsAPI) {
   return function (state, dispatch) {
     var nodes = state.schema.nodes,

package/dist/esm/pm-plugins/actions.js

@@ -1,5 +1,7 @@
 export var ACTIONS = {
   SET_COPIED_TO_CLIPBOARD: 'SET_COPIED_TO_CLIPBOARD',
   SET_SHOULD_IGNORE_FOLLOWING_MUTATIONS: 'SET_SHOULD_IGNORE_FOLLOWING_MUTATIONS',
-  SET_IS_WRAPPED: 'SET_IS_WRAPPED'
+  SET_IS_WRAPPED: 'SET_IS_WRAPPED',
+  SET_AUTO_DETECT_ENTRY: 'SET_AUTO_DETECT_ENTRY',
+  REMOVE_AUTO_DETECT_ENTRY: 'REMOVE_AUTO_DETECT_ENTRY'
 };

package/dist/esm/pm-plugins/auto-detect-state.js

@@ -0,0 +1,5 @@
+import { PluginKey } from '@atlaskit/editor-prosemirror/state';
+export var autoDetectPluginKey = new PluginKey('codeBlockAutoDetectPlugin');
+export var getAutoDetectPluginState = function getAutoDetectPluginState(state) {
+  return autoDetectPluginKey.getState(state);
+};

package/dist/esm/pm-plugins/auto-detect.js

@@ -0,0 +1,50 @@
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
+import { removeAutoDetection, updateAutoDetectState } from '../utils/auto-detect-state';
+import { syncPendingDetectionTimers } from '../utils/auto-detect-view';
+import { ACTIONS } from './actions';
+import { autoDetectPluginKey } from './auto-detect-state';
+export var createAutoDetectPlugin = function createAutoDetectPlugin(api) {
+  return new SafePlugin({
+    key: autoDetectPluginKey,
+    state: {
+      init: function init() {
+        return {
+          languageDetectionMap: {}
+        };
+      },
+      apply: function apply(tr, pluginState) {
+        var meta = tr.getMeta(autoDetectPluginKey);
+        var languageDetectionMap = tr.docChanged ? updateAutoDetectState(tr, pluginState) : pluginState.languageDetectionMap;
+        if ((meta === null || meta === void 0 ? void 0 : meta.type) === ACTIONS.SET_AUTO_DETECT_ENTRY) {
+          languageDetectionMap = _objectSpread(_objectSpread({}, languageDetectionMap), {}, _defineProperty({}, meta.data.localId, meta.data.entry));
+        } else if ((meta === null || meta === void 0 ? void 0 : meta.type) === ACTIONS.REMOVE_AUTO_DETECT_ENTRY) {
+          languageDetectionMap = removeAutoDetection(languageDetectionMap, meta.data.localId);
+        }
+        if (languageDetectionMap === pluginState.languageDetectionMap) {
+          return pluginState;
+        }
+        return {
+          languageDetectionMap: languageDetectionMap
+        };
+      }
+    },
+    view: function view(_view) {
+      var timers = new Map();
+      return {
+        update: function update() {
+          syncPendingDetectionTimers(_view, timers, api);
+        },
+        destroy: function destroy() {
+          timers.forEach(function (_ref) {
+            var timer = _ref.timer;
+            return clearTimeout(timer);
+          });
+          timers.clear();
+        }
+      };
+    }
+  });
+};

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

@@ -102,11 +102,11 @@ export var createPlugin = function createPlugin(_ref) {
         }
         if (tr.docChanged) {
           var _node = findCodeBlock(newState, tr.selection);
+          var codeBlockNodes = getAllChangedCodeBlocksInTransaction(tr);
 
           // Updates mapping position of all existing decorations to new positions
           // specifically used for updating word wrap node decorators (does not cover drag & drop, validateWordWrappedDecorators does).
           var updatedDecorationSet = pluginState.decorations.map(tr.mapping, tr.doc);
-          var codeBlockNodes = getAllChangedCodeBlocksInTransaction(tr);
           if (codeBlockNodes) {
             updateCodeBlockWrappedStateNodeKeys(codeBlockNodes, _oldState);
             // Disabled when using advanced code block for performance reasons

package/dist/esm/pm-plugins/toolbar.js

@@ -17,9 +17,38 @@ import { changeLanguage, copyContentToClipboardWithAnalytics, removeCodeBlockWit
 import { CodeBlockLanguagePicker } from '../ui/CodeBlockLanguagePicker';
 import { WrapIcon } from '../ui/icons/WrapIcon';
 import { NONE_LANGUAGE_VALUE, PLAIN_TEXT_LANGUAGE_VALUE } from '../ui/language-picker-options';
+import { autoDetectPluginKey } from './auto-detect-state';
 import { provideVisualFeedbackForCopyButton, removeVisualFeedbackForCopyButton } from './codeBlockCopySelectionPlugin';
 import { createLanguageList, DEFAULT_LANGUAGES, getLanguageIdentifier } from './language-list';
 import { pluginKey } from './plugin-key';
+var getAutoDetectPickerValue = function getAutoDetectPickerValue(_ref) {
+  var autoDetectEntry = _ref.autoDetectEntry,
+    formatMessage = _ref.formatMessage,
+    language = _ref.language,
+    languagePickerOptions = _ref.languagePickerOptions;
+  var defaultPickerValue = language ? languagePickerOptions.find(function (option) {
+    return language === NONE_LANGUAGE_VALUE ? option.value === PLAIN_TEXT_LANGUAGE_VALUE : option.value === language || option.alias.includes(language);
+  }) : undefined;
+
+  // A weak re-detection records noneDetected but can leave a previously auto-detected
+  // language on the node. Keep showing "(detected)" only while that preserved language
+  // still matches the node language, so manual language changes do not inherit the label.
+  if (defaultPickerValue && ((autoDetectEntry === null || autoDetectEntry === void 0 ? void 0 : autoDetectEntry.detectionResult) === 'detected' || (autoDetectEntry === null || autoDetectEntry === void 0 ? void 0 : autoDetectEntry.detectionResult) === 'noneDetected' && autoDetectEntry.autoDetectedLanguage === language)) {
+    return _objectSpread(_objectSpread({}, defaultPickerValue), {}, {
+      label: formatMessage(codeBlockButtonMessages.detectedLanguage, {
+        language: defaultPickerValue.label
+      })
+    });
+  }
+  if ((autoDetectEntry === null || autoDetectEntry === void 0 ? void 0 : autoDetectEntry.detectionResult) === 'noneDetected' && !language) {
+    return {
+      alias: [],
+      label: formatMessage(codeBlockButtonMessages.noneDetected),
+      value: NONE_LANGUAGE_VALUE
+    };
+  }
+  return defaultPickerValue;
+};
 export var getToolbarConfig = function getToolbarConfig() {
   var allowCopyToClipboard = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
   var api = arguments.length > 1 ? arguments[1] : undefined;
@@ -36,12 +65,12 @@ export var getToolbarConfig = function getToolbarConfig() {
       alias: lang.alias
     };
   });
-  return function (state, _ref) {
-    var _api$editorViewMode, _api$decorations$acti, _api$decorations, _api$analytics, _codeBlockState$pos, _node$attrs;
-    var formatMessage = _ref.formatMessage;
+  return function (state, _ref2) {
+    var _api$editorViewMode, _api$decorations$acti, _api$decorations, _api$analytics, _codeBlockState$pos, _node$attrs, _node$attrs2;
+    var formatMessage = _ref2.formatMessage;
     var isViewMode = (api === null || api === void 0 || (_api$editorViewMode = api.editorViewMode) === null || _api$editorViewMode === void 0 || (_api$editorViewMode = _api$editorViewMode.sharedState.currentState()) === null || _api$editorViewMode === void 0 ? void 0 : _api$editorViewMode.mode) === 'view';
-    var _ref2 = (_api$decorations$acti = api === null || api === void 0 || (_api$decorations = api.decorations) === null || _api$decorations === void 0 ? void 0 : _api$decorations.actions) !== null && _api$decorations$acti !== void 0 ? _api$decorations$acti : {},
-      hoverDecoration = _ref2.hoverDecoration;
+    var _ref3 = (_api$decorations$acti = api === null || api === void 0 || (_api$decorations = api.decorations) === null || _api$decorations === void 0 ? void 0 : _api$decorations.actions) !== null && _api$decorations$acti !== void 0 ? _api$decorations$acti : {},
+      hoverDecoration = _ref3.hoverDecoration;
     var editorAnalyticsAPI = api === null || api === void 0 || (_api$analytics = api.analytics) === null || _api$analytics === void 0 ? void 0 : _api$analytics.actions;
     var codeBlockState = pluginKey.getState(state);
     var pos = (_codeBlockState$pos = codeBlockState === null || codeBlockState === void 0 ? void 0 : codeBlockState.pos) !== null && _codeBlockState$pos !== void 0 ? _codeBlockState$pos : null;
@@ -56,6 +85,10 @@ export var getToolbarConfig = function getToolbarConfig() {
     var isWrapped = isCodeBlockWordWrapEnabled(node);
     var areLineNumbersVisible = areCodeBlockLineNumbersVisible(node);
     var language = node === null || node === void 0 || (_node$attrs = node.attrs) === null || _node$attrs === void 0 ? void 0 : _node$attrs.language;
+    var localId = node === null || node === void 0 || (_node$attrs2 = node.attrs) === null || _node$attrs2 === void 0 ? void 0 : _node$attrs2.localId;
+    var autoDetectState = autoDetectPluginKey.getState(state);
+    var autoDetectEntry = expValEquals('platform_editor_code_block_auto_detection', 'isEnabled', true) && typeof localId === 'string' ? autoDetectState === null || autoDetectState === void 0 ? void 0 : autoDetectState.languageDetectionMap[localId] : undefined;
+
     // Keep fresh option objects for the legacy toolbar select so reopening it
     // continues to start from the top rather than preserving the previously
     // focused option by reference.
@@ -81,9 +114,12 @@ export var getToolbarConfig = function getToolbarConfig() {
     };
     var languagePicker;
     if (expValEquals('platform_editor_code_block_q4_lovability', 'isEnabled', true) && fg('platform_editor_code_block_add_line_number_button')) {
-      var defaultPickerValue = language ? languagePickerOptions.find(function (option) {
-        return language === NONE_LANGUAGE_VALUE ? option.value === PLAIN_TEXT_LANGUAGE_VALUE : option.value === language || option.alias.includes(language);
-      }) : undefined;
+      var autoDetectPickerValue = getAutoDetectPickerValue({
+        autoDetectEntry: autoDetectEntry,
+        formatMessage: formatMessage,
+        language: language,
+        languagePickerOptions: languagePickerOptions
+      });
       languagePicker = {
         type: 'custom',
         fallback: [],
@@ -93,7 +129,7 @@ export var getToolbarConfig = function getToolbarConfig() {
           }
           return /*#__PURE__*/React.createElement(CodeBlockLanguagePicker, {
             api: api,
-            defaultValue: defaultPickerValue,
+            defaultValue: autoDetectPickerValue,
             editorView: view,
             filterOption: languageListFilter,
             formatMessage: formatMessage,
@@ -225,8 +261,8 @@ export var getToolbarConfig = function getToolbarConfig() {
 export var languageListFilter = function languageListFilter(option, rawInput) {
   // Ignored via go/ees005
   // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  var _ref3 = option,
-    data = _ref3.data;
+  var _ref4 = option,
+    data = _ref4.data;
   var searchString = rawInput.toLowerCase();
   return data.label.toLowerCase().includes(searchString) || data.alias.some(function (alias) {
     return alias.toLowerCase() === searchString;

package/dist/esm/pm-plugins/utils.js

@@ -34,8 +34,5 @@ export function getAllChangedCodeBlocksInTransaction(tr) {
       });
     });
   });
-  if (changedCodeBlocks.length < 1) {
-    return null;
-  }
   return changedCodeBlocks;
 }

package/dist/esm/ui/CodeBlockLanguagePicker.js

@@ -1,8 +1,12 @@
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import React, { useCallback, useState } from 'react';
+import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
+import { changeLanguage, detectLanguage } from '../editor-commands';
+import { DETECT_LANGUAGE_VALUE } from './language-picker-options';
 import { LanguagePicker } from './LanguagePicker';
 import { getRecentLanguages, saveRecentLanguage } from './recent-languages';
 export var CodeBlockLanguagePicker = function CodeBlockLanguagePicker(_ref) {
+  var _api$analytics2;
   var api = _ref.api,
     defaultValue = _ref.defaultValue,
     editorView = _ref.editorView,
@@ -18,19 +22,22 @@ export var CodeBlockLanguagePicker = function CodeBlockLanguagePicker(_ref) {
   var refreshRecentLanguages = useCallback(function () {
     setRecentLanguageValues(getRecentLanguages());
   }, []);
-  var handleLanguageSelect = useCallback(function (language) {
-    saveRecentLanguage(language);
-    setRecentLanguageValues(getRecentLanguages());
-  }, []);
+  var handleSelection = useCallback(function (option, selectionSource) {
+    var _api$analytics;
+    var command = option.value === DETECT_LANGUAGE_VALUE && expValEquals('platform_editor_code_block_auto_detection', 'isEnabled', true) ? detectLanguage() : changeLanguage(api === null || api === void 0 || (_api$analytics = api.analytics) === null || _api$analytics === void 0 ? void 0 : _api$analytics.actions)(option.value, selectionSource);
+    var commandSucceeded = command(editorView.state, editorView.dispatch);
+    if (commandSucceeded && option.value !== DETECT_LANGUAGE_VALUE) {
+      saveRecentLanguage(option.value);
+      setRecentLanguageValues(getRecentLanguages());
+    }
+  }, [api === null || api === void 0 || (_api$analytics2 = api.analytics) === null || _api$analytics2 === void 0 ? void 0 : _api$analytics2.actions, editorView]);
   return /*#__PURE__*/React.createElement(LanguagePicker, {
-    api: api,
     defaultValue: defaultValue,
-    editorView: editorView,
     filterOption: filterOption,
     formatMessage: formatMessage,
     languagePickerOptions: languagePickerOptions,
     recentLanguageValues: recentLanguageValues,
-    onLanguageSelect: handleLanguageSelect,
-    onMenuOpen: refreshRecentLanguages
+    onMenuOpen: refreshRecentLanguages,
+    onSelection: handleSelection
   });
 };

package/dist/esm/ui/LanguagePicker.js

@@ -12,7 +12,6 @@ import { akEditorLineHeight } from '@atlaskit/editor-shared-styles';
 import ChevronDownIcon from '@atlaskit/icon/core/chevron-down';
 import { Box } from '@atlaskit/primitives/compiled';
 import { PopupSelect, components } from '@atlaskit/select';
-import { changeLanguage } from '../editor-commands';
 import { createGroupedLanguageOptions } from './language-picker-options';
 var pickerOptionStyles = null;
 var styles = {
@@ -72,18 +71,15 @@ var getRecentlyUsedLanguages = function getRecentlyUsedLanguages(recentLanguageV
   return recentlyUsedLanguages;
 };
 export var LanguagePicker = function LanguagePicker(_ref) {
-  var _api$analytics, _defaultValue$label;
-  var api = _ref.api,
-    defaultValue = _ref.defaultValue,
-    editorView = _ref.editorView,
+  var _defaultValue$label;
+  var defaultValue = _ref.defaultValue,
     filterOption = _ref.filterOption,
     formatMessage = _ref.formatMessage,
     languagePickerOptions = _ref.languagePickerOptions,
     _ref$recentLanguageVa = _ref.recentLanguageValues,
     recentLanguageValues = _ref$recentLanguageVa === void 0 ? [] : _ref$recentLanguageVa,
-    onLanguageSelect = _ref.onLanguageSelect,
-    onMenuOpen = _ref.onMenuOpen;
-  var editorAnalyticsAPI = api === null || api === void 0 || (_api$analytics = api.analytics) === null || _api$analytics === void 0 ? void 0 : _api$analytics.actions;
+    onMenuOpen = _ref.onMenuOpen,
+    onSelection = _ref.onSelection;
   var label = (_defaultValue$label = defaultValue === null || defaultValue === void 0 ? void 0 : defaultValue.label) !== null && _defaultValue$label !== void 0 ? _defaultValue$label : formatMessage(codeBlockButtonMessages.selectLanguage);
   var selectLanguageLabel = formatMessage(codeBlockButtonMessages.selectLanguage);
   var _useState = useState(false),
@@ -118,11 +114,8 @@ export var LanguagePicker = function LanguagePicker(_ref) {
     }
     var isSearchSelection = inputValueRef.current.trim().length > 0;
     var selectionSource = isSearchSelection ? 'search' : (_option$selectionSour = option.selectionSource) !== null && _option$selectionSour !== void 0 ? _option$selectionSour : 'all';
-    var commandSucceeded = changeLanguage(editorAnalyticsAPI)(option.value, selectionSource)(editorView.state, editorView.dispatch);
-    if (commandSucceeded) {
-      onLanguageSelect === null || onLanguageSelect === void 0 || onLanguageSelect(option.value);
-    }
-  }, [editorAnalyticsAPI, editorView, onLanguageSelect]);
+    onSelection(option, selectionSource);
+  }, [onSelection]);
   var handleInputChange = useCallback(function (newInputValue, actionMeta) {
     // React-select clears the input as part of selecting a value before onChange fires.
     // Keep the last user-typed query so handleChange can report search selections correctly.
@@ -147,10 +140,9 @@ export var LanguagePicker = function LanguagePicker(_ref) {
       appearance: "subtle",
       isSelected: isOpen,
       "aria-controls": ariaControls,
-      "aria-label": selectLanguageLabel,
       testId: "code-block-language-picker-trigger"
     }, label));
-  }, [label, selectLanguageLabel]);
+  }, [label]);
   return /*#__PURE__*/React.createElement(PopupSelect, {
     components: popupSelectComponents,
     filterOption: filterOption,

package/dist/esm/ui/language-picker-options.js

@@ -3,6 +3,7 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 import { codeBlockButtonMessages } from '@atlaskit/editor-common/messages';
+import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
 export var NONE_LANGUAGE_VALUE = 'none';
 export var DETECT_LANGUAGE_VALUE = 'autodetect';
 export var PLAIN_TEXT_LANGUAGE_VALUE = 'text';
@@ -28,7 +29,7 @@ export var createGroupedLanguageOptions = function createGroupedLanguageOptions(
   var plainTextOption = languages.find(function (language) {
     return language.value === PLAIN_TEXT_LANGUAGE_VALUE;
   });
-  var pinnedOptions = [getDetectLanguageOption(formatMessage)];
+  var pinnedOptions = expValEquals('platform_editor_code_block_auto_detection', 'isEnabled', true) ? [getDetectLanguageOption(formatMessage)] : [];
   if (plainTextOption) {
     pinnedOptions.push(_objectSpread(_objectSpread({}, plainTextOption), {}, {
       selectionSource: 'pinned'

package/dist/esm/utils/auto-detect-state.js

@@ -0,0 +1,178 @@
+import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+import { getInsertedCodeBlocksInTransaction } from '@atlaskit/editor-common/code-block';
+import { getAllChangedCodeBlocksInTransaction } from '../pm-plugins/utils';
+var MIN_AUTO_DETECT_TEXT_LENGTH = 20;
+export var shouldTriggerLargeChangeDetection = function shouldTriggerLargeChangeDetection(lastObservedText, text) {
+  if (!lastObservedText) {
+    return text.length > 0;
+  }
+  return Math.abs(text.length - lastObservedText.length) > lastObservedText.length / 2;
+};
+export var getFirstLine = function getFirstLine(text) {
+  var _text$split$;
+  return (_text$split$ = text.split('\n')[0]) !== null && _text$split$ !== void 0 ? _text$split$ : '';
+};
+export var hasEnoughTextForAutoDetection = function hasEnoughTextForAutoDetection(text) {
+  return text.trim().length >= MIN_AUTO_DETECT_TEXT_LENGTH;
+};
+export var getLocalId = function getLocalId(node) {
+  return typeof node.attrs.localId === 'string' ? node.attrs.localId : null;
+};
+export var createAutoDetectEntry = function createAutoDetectEntry(node, pos, isPending, previous) {
+  return {
+    lastObservedText: node.textContent,
+    lastObservedFirstLine: getFirstLine(node.textContent),
+    isPending: isPending,
+    detectionResult: previous === null || previous === void 0 ? void 0 : previous.detectionResult,
+    autoDetectedLanguage: previous === null || previous === void 0 ? void 0 : previous.autoDetectedLanguage,
+    pos: pos
+  };
+};
+export var queueAutoDetection = function queueAutoDetection(languageDetectionMap, node, pos, isPending) {
+  var localId = getLocalId(node);
+  if (!localId) {
+    return languageDetectionMap;
+  }
+  return _objectSpread(_objectSpread({}, languageDetectionMap), {}, _defineProperty({}, localId, createAutoDetectEntry(node, pos, isPending, languageDetectionMap[localId])));
+};
+export var removeAutoDetection = function removeAutoDetection(languageDetectionMap, localId) {
+  if (!languageDetectionMap[localId]) {
+    return languageDetectionMap;
+  }
+  var nextLanguageDetectionMap = _objectSpread({}, languageDetectionMap);
+  delete nextLanguageDetectionMap[localId];
+  return nextLanguageDetectionMap;
+};
+var getCodeBlockLocalIdsRemovedFromChangedRanges = function getCodeBlockLocalIdsRemovedFromChangedRanges(tr, codeBlockType) {
+  var localIds = new Set();
+  tr.steps.forEach(function (step, stepIndex) {
+    var docAtStep = tr.docs[stepIndex];
+    step.getMap().forEach(function (oldStart, oldEnd) {
+      if (oldStart === oldEnd) {
+        return;
+      }
+      var clampedOldEnd = Math.min(oldEnd, docAtStep.content.size);
+      docAtStep.nodesBetween(oldStart, clampedOldEnd, function (node, pos) {
+        if (node.type !== codeBlockType) {
+          return true;
+        }
+        var isWholeCodeBlockRemoved = pos >= oldStart && pos + node.nodeSize <= clampedOldEnd;
+        if (!isWholeCodeBlockRemoved) {
+          return false;
+        }
+        var localId = getLocalId(node);
+        if (localId) {
+          localIds.add(localId);
+        }
+        return false;
+      });
+    });
+  });
+  return localIds;
+};
+var getCodeBlockTransactionChanges = function getCodeBlockTransactionChanges(tr, codeBlockType) {
+  var insertedNodesWithPos = getInsertedCodeBlocksInTransaction(tr, codeBlockType);
+  var removedFromChangedRangesLocalIds = getCodeBlockLocalIdsRemovedFromChangedRanges(tr, codeBlockType);
+  var insertedLocalIds = new Set();
+  var insertedCodeBlocks = [];
+  insertedNodesWithPos.forEach(function (_ref) {
+    var node = _ref.node,
+      pos = _ref.pos;
+    var localId = getLocalId(node);
+    if (!localId) {
+      return;
+    }
+    insertedLocalIds.add(localId);
+    if (!removedFromChangedRangesLocalIds.has(localId)) {
+      insertedCodeBlocks.push({
+        localId: localId,
+        node: node,
+        pos: pos
+      });
+    }
+  });
+  var deletedLocalIds = new Set();
+  removedFromChangedRangesLocalIds.forEach(function (localId) {
+    if (!insertedLocalIds.has(localId)) {
+      deletedLocalIds.add(localId);
+    }
+  });
+  return {
+    deletedLocalIds: deletedLocalIds,
+    insertedCodeBlocks: insertedCodeBlocks
+  };
+};
+export var updateAutoDetectState = function updateAutoDetectState(tr, pluginState) {
+  var codeBlock = tr.doc.type.schema.nodes.codeBlock;
+  var isPaste = tr.getMeta('paste') === true || tr.getMeta('uiEvent') === 'paste';
+  var isExternalContentChange = tr.getMeta('replaceDocument') === true || tr.getMeta('isRemote') === true;
+  var hasTrackedEntries = Object.keys(pluginState.languageDetectionMap).length > 0;
+
+  // Page loads and remote edits should not start auto-detection for code blocks.
+  if (!hasTrackedEntries && isExternalContentChange) {
+    return pluginState.languageDetectionMap;
+  }
+
+  // Existing entries still need mapping/deletion cleanup, but external edits should not refresh text.
+  var changedCodeBlockNodes = isExternalContentChange ? [] : getAllChangedCodeBlocksInTransaction(tr);
+  if (!hasTrackedEntries && !changedCodeBlockNodes.length) {
+    return pluginState.languageDetectionMap;
+  }
+  var _getCodeBlockTransact = getCodeBlockTransactionChanges(tr, codeBlock),
+    deletedLocalIds = _getCodeBlockTransact.deletedLocalIds,
+    insertedCodeBlocks = _getCodeBlockTransact.insertedCodeBlocks;
+  var languageDetectionMap = hasTrackedEntries ? Object.fromEntries(Object.entries(pluginState.languageDetectionMap).map(function (_ref2) {
+    var _ref3 = _slicedToArray(_ref2, 2),
+      localId = _ref3[0],
+      entry = _ref3[1];
+    return [localId, _objectSpread(_objectSpread({}, entry), {}, {
+      pos: tr.mapping.map(entry.pos)
+    })];
+  })) : pluginState.languageDetectionMap;
+  if (!isExternalContentChange) {
+    insertedCodeBlocks.forEach(function (_ref4) {
+      var localId = _ref4.localId,
+        node = _ref4.node,
+        pos = _ref4.pos;
+      if (node.attrs.language) {
+        languageDetectionMap = removeAutoDetection(languageDetectionMap, localId);
+        return;
+      }
+      languageDetectionMap = queueAutoDetection(languageDetectionMap, node, pos, hasEnoughTextForAutoDetection(node.textContent));
+    });
+    changedCodeBlockNodes.forEach(function (_ref5) {
+      var node = _ref5.node,
+        pos = _ref5.pos;
+      var localId = getLocalId(node);
+      if (!localId || !languageDetectionMap[localId]) {
+        return;
+      }
+      var currentLanguage = node.attrs.language;
+      var previousEntry = languageDetectionMap[localId];
+      if (currentLanguage && currentLanguage !== previousEntry.autoDetectedLanguage) {
+        languageDetectionMap = removeAutoDetection(languageDetectionMap, localId);
+        return;
+      }
+      var text = node.textContent;
+      var firstLine = getFirstLine(text);
+      var shouldTriggerDetection = previousEntry.isPending || isPaste || firstLine !== previousEntry.lastObservedFirstLine || shouldTriggerLargeChangeDetection(previousEntry.lastObservedText, text);
+      var isPending = hasEnoughTextForAutoDetection(text) && shouldTriggerDetection;
+
+      // Only pending detection refreshes the text snapshot; otherwise gradual typing
+      // should continue comparing against the last attempted detection.
+      languageDetectionMap = isPending ? queueAutoDetection(languageDetectionMap, node, pos, true) : _objectSpread(_objectSpread({}, languageDetectionMap), {}, _defineProperty({}, localId, _objectSpread(_objectSpread({}, previousEntry), {}, {
+        isPending: false,
+        pos: pos
+      })));
+    });
+  }
+  deletedLocalIds.forEach(function (localId) {
+    if (languageDetectionMap[localId]) {
+      languageDetectionMap = removeAutoDetection(languageDetectionMap, localId);
+    }
+  });
+  return languageDetectionMap;
+};