@atlaskit/editor-core 208.0.1 → 208.1.1

package/CHANGELOG.md

@@ -1,5 +1,21 @@
 # @atlaskit/editor-core
 
+## 208.1.1
+
+### Patch Changes
+
+- [#173477](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/173477)
+  [`bfdfefb6b7135`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/bfdfefb6b7135) -
+  [ux] Set focus before editor
+
+## 208.1.0
+
+### Minor Changes
+
+- [#173344](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/173344)
+  [`a0e9c4a83afe5`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/a0e9c4a83afe5) -
+  Add EditorNextProps export from composable-editor entry point
+
 ## 208.0.1
 
 ### Patch Changes

package/dist/cjs/create-editor/ReactEditorView/focusEditorElement.js

@@ -0,0 +1,13 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.focusEditorElement = focusEditorElement;
+function focusEditorElement(editorId) {
+  var parentElement = document.querySelector("[data-focus-id=\"".concat(editorId, "\"]"));
+  if (!(parentElement instanceof HTMLElement)) {
+    return;
+  }
+  parentElement.focus();
+}

package/dist/cjs/create-editor/ReactEditorView.js

@@ -42,6 +42,7 @@ var _createEditor = require("./create-editor");
 var _createPluginsList = _interopRequireDefault(require("./create-plugins-list"));
 var _createSchema = require("./create-schema");
 var _messages = require("./messages");
+var _focusEditorElement = require("./ReactEditorView/focusEditorElement");
 var _getUAPrefix = require("./ReactEditorView/getUAPrefix");
 var _handleEditorFocus = require("./ReactEditorView/handleEditorFocus");
 var _useDispatchTransaction = require("./ReactEditorView/useDispatchTransaction");
@@ -494,6 +495,11 @@ function ReactEditorView(props) {
           if (!liveDocWithContent || !(0, _platformFeatureFlags.fg)('platform_editor_no_cursor_on_live_doc_init')) {
             focusTimeoutId.current = (0, _handleEditorFocus.handleEditorFocus)(editorView);
           }
+          if ((0, _expValEquals.expValEquals)('platform_editor_no_cursor_on_edit_page_init', 'isEnabled', true) && (0, _platformFeatureFlags.fg)('cc_editor_focus_before_editor_on_load')) {
+            if (!disabled && shouldFocus && !(0, _document.isEmptyDocument)(editorView.state.doc)) {
+              (0, _focusEditorElement.focusEditorElement)(editorId.current);
+            }
+          }
         }
       } else {
         var _liveDocWithContent = (__livePage || (0, _expValEquals.expValEquals)('platform_editor_no_cursor_on_edit_page_init', 'isEnabled', true)) && !(0, _document.isEmptyDocument)(editorView.state.doc);
@@ -502,7 +508,7 @@ function ReactEditorView(props) {
         }
       }
     }
-  }, [editorView, shouldFocus, __livePage, mitigateScrollJump]);
+  }, [editorView, shouldFocus, __livePage, mitigateScrollJump, disabled]);
   var scrollElement = _react.default.useRef();
   var possibleListeners = _react.default.useRef([]);
   _react.default.useEffect(function () {
@@ -619,6 +625,11 @@ function ReactEditorView(props) {
               if (!isLivePageWithContent && shouldFocus && view.props.editable && view.props.editable(view.state)) {
                 focusTimeoutId.current = (0, _handleEditorFocus.handleEditorFocus)(view);
               }
+              if ((0, _expValEquals.expValEquals)('platform_editor_no_cursor_on_edit_page_init', 'isEnabled', true) && (0, _platformFeatureFlags.fg)('cc_editor_focus_before_editor_on_load')) {
+                if (shouldFocus && view.props.editable && view.props.editable(view.state) && !(0, _document.isEmptyDocument)(view.state.doc)) {
+                  (0, _focusEditorElement.focusEditorElement)(editorId.current);
+                }
+              }
             }
           } else {
             var _isLivePageWithContent = (__livePage || (0, _expValEquals.expValEquals)('platform_editor_no_cursor_on_edit_page_init', 'isEnabled', true)) && !(0, _document.isEmptyDocument)(view.state.doc) && (0, _platformFeatureFlags.fg)('platform_editor_no_cursor_on_live_doc_init');
@@ -658,7 +669,11 @@ function ReactEditorView(props) {
     }
   }, [createEditorView, onEditorCreated, eventDispatcher, shouldFocus, __livePage, onEditorDestroyed, handleAnalyticsEvent, mitigateScrollJump]);
   var createEditor = (0, _react.useCallback)(function (assistiveLabel, assistiveDescribedBy) {
-    return /*#__PURE__*/_react.default.createElement("div", {
+    return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, (0, _platformFeatureFlags.fg)('cc_editor_focus_before_editor_on_load') && /*#__PURE__*/_react.default.createElement("div", {
+      tabIndex: -1,
+      "data-focus-id": editorId.current,
+      "data-testid": "react-editor-view-inital-focus-element"
+    }), /*#__PURE__*/_react.default.createElement("div", {
       // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
       className: ((0, _expValEquals.expValEquals)('platform_editor_stable_editorview_classname', 'isEnabled', true) ? 'ProseMirror ' : '') + (0, _getUAPrefix.getUAPrefix)(),
       key: "ProseMirror",
@@ -675,7 +690,7 @@ function ReactEditorView(props) {
       id: EDIT_AREA_ID,
       "aria-describedby": assistiveDescribedBy,
       "data-editor-id": editorId.current
-    });
+    }));
   }, [handleEditorViewRef, props.intl]);
   var previousPreset = (0, _hooks.usePreviousState)(preset);
   (0, _react.useLayoutEffect)(function () {
@@ -696,6 +711,11 @@ function ReactEditorView(props) {
       if (!disabled && shouldFocus && !isLivePageWithContent) {
         focusTimeoutId.current = (0, _handleEditorFocus.handleEditorFocus)(viewRef.current);
       }
+      if ((0, _expValEquals.expValEquals)('platform_editor_no_cursor_on_edit_page_init', 'isEnabled', true) && (0, _platformFeatureFlags.fg)('cc_editor_focus_before_editor_on_load')) {
+        if (!disabled && shouldFocus && !(0, _document.isEmptyDocument)(viewRef.current.state.doc)) {
+          (0, _focusEditorElement.focusEditorElement)(editorId.current);
+        }
+      }
     }
   }, [disabled, shouldFocus, previousDisabledState, __livePage]);
   (0, _useFireFullWidthEvent.useFireFullWidthEvent)(nextAppearance, dispatchAnalyticsEvent);

package/dist/cjs/version-wrapper.js

@@ -5,4 +5,4 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.version = exports.name = void 0;
 var name = exports.name = "@atlaskit/editor-core";
-var version = exports.version = "208.0.0";
+var version = exports.version = "208.1.0";

package/dist/es2019/create-editor/ReactEditorView/focusEditorElement.js

@@ -0,0 +1,7 @@
+export function focusEditorElement(editorId) {
+  const parentElement = document.querySelector(`[data-focus-id="${editorId}"]`);
+  if (!(parentElement instanceof HTMLElement)) {
+    return;
+  }
+  parentElement.focus();
+}

package/dist/es2019/create-editor/ReactEditorView.js

@@ -30,6 +30,7 @@ import { createErrorReporter, createPMPlugins, processPluginsList } from './crea
 import createPluginsList from './create-plugins-list';
 import { createSchema } from './create-schema';
 import { editorMessages } from './messages';
+import { focusEditorElement } from './ReactEditorView/focusEditorElement';
 import { getUAPrefix } from './ReactEditorView/getUAPrefix';
 import { handleEditorFocus } from './ReactEditorView/handleEditorFocus';
 import { useDispatchTransaction } from './ReactEditorView/useDispatchTransaction';
@@ -461,6 +462,11 @@ export function ReactEditorView(props) {
           if (!liveDocWithContent || !fg('platform_editor_no_cursor_on_live_doc_init')) {
             focusTimeoutId.current = handleEditorFocus(editorView);
           }
+          if (expValEquals('platform_editor_no_cursor_on_edit_page_init', 'isEnabled', true) && fg('cc_editor_focus_before_editor_on_load')) {
+            if (!disabled && shouldFocus && !isEmptyDocument(editorView.state.doc)) {
+              focusEditorElement(editorId.current);
+            }
+          }
         }
       } else {
         const liveDocWithContent = (__livePage || expValEquals('platform_editor_no_cursor_on_edit_page_init', 'isEnabled', true)) && !isEmptyDocument(editorView.state.doc);
@@ -469,7 +475,7 @@ export function ReactEditorView(props) {
         }
       }
     }
-  }, [editorView, shouldFocus, __livePage, mitigateScrollJump]);
+  }, [editorView, shouldFocus, __livePage, mitigateScrollJump, disabled]);
   const scrollElement = React.useRef();
   const possibleListeners = React.useRef([]);
   React.useEffect(() => {
@@ -566,6 +572,11 @@ export function ReactEditorView(props) {
               if (!isLivePageWithContent && shouldFocus && view.props.editable && view.props.editable(view.state)) {
                 focusTimeoutId.current = handleEditorFocus(view);
               }
+              if (expValEquals('platform_editor_no_cursor_on_edit_page_init', 'isEnabled', true) && fg('cc_editor_focus_before_editor_on_load')) {
+                if (shouldFocus && view.props.editable && view.props.editable(view.state) && !isEmptyDocument(view.state.doc)) {
+                  focusEditorElement(editorId.current);
+                }
+              }
             }
           } else {
             const isLivePageWithContent = (__livePage || expValEquals('platform_editor_no_cursor_on_edit_page_init', 'isEnabled', true)) && !isEmptyDocument(view.state.doc) && fg('platform_editor_no_cursor_on_live_doc_init');
@@ -605,7 +616,11 @@ export function ReactEditorView(props) {
     }
   }, [createEditorView, onEditorCreated, eventDispatcher, shouldFocus, __livePage, onEditorDestroyed, handleAnalyticsEvent, mitigateScrollJump]);
   const createEditor = useCallback((assistiveLabel, assistiveDescribedBy) => {
-    return /*#__PURE__*/React.createElement("div", {
+    return /*#__PURE__*/React.createElement(React.Fragment, null, fg('cc_editor_focus_before_editor_on_load') && /*#__PURE__*/React.createElement("div", {
+      tabIndex: -1,
+      "data-focus-id": editorId.current,
+      "data-testid": "react-editor-view-inital-focus-element"
+    }), /*#__PURE__*/React.createElement("div", {
       // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
       className: (expValEquals('platform_editor_stable_editorview_classname', 'isEnabled', true) ? 'ProseMirror ' : '') + getUAPrefix(),
       key: "ProseMirror",
@@ -622,7 +637,7 @@ export function ReactEditorView(props) {
       id: EDIT_AREA_ID,
       "aria-describedby": assistiveDescribedBy,
       "data-editor-id": editorId.current
-    });
+    }));
   }, [handleEditorViewRef, props.intl]);
   const previousPreset = usePreviousState(preset);
   useLayoutEffect(() => {
@@ -641,6 +656,11 @@ export function ReactEditorView(props) {
       if (!disabled && shouldFocus && !isLivePageWithContent) {
         focusTimeoutId.current = handleEditorFocus(viewRef.current);
       }
+      if (expValEquals('platform_editor_no_cursor_on_edit_page_init', 'isEnabled', true) && fg('cc_editor_focus_before_editor_on_load')) {
+        if (!disabled && shouldFocus && !isEmptyDocument(viewRef.current.state.doc)) {
+          focusEditorElement(editorId.current);
+        }
+      }
     }
   }, [disabled, shouldFocus, previousDisabledState, __livePage]);
   useFireFullWidthEvent(nextAppearance, dispatchAnalyticsEvent);

package/dist/es2019/version-wrapper.js

@@ -1,2 +1,2 @@
 export const name = "@atlaskit/editor-core";
-export const version = "208.0.0";
+export const version = "208.1.0";

package/dist/esm/create-editor/ReactEditorView/focusEditorElement.js

@@ -0,0 +1,7 @@
+export function focusEditorElement(editorId) {
+  var parentElement = document.querySelector("[data-focus-id=\"".concat(editorId, "\"]"));
+  if (!(parentElement instanceof HTMLElement)) {
+    return;
+  }
+  parentElement.focus();
+}

package/dist/esm/create-editor/ReactEditorView.js

@@ -38,6 +38,7 @@ import { createErrorReporter, createPMPlugins, processPluginsList } from './crea
 import createPluginsList from './create-plugins-list';
 import { createSchema } from './create-schema';
 import { editorMessages } from './messages';
+import { focusEditorElement } from './ReactEditorView/focusEditorElement';
 import { getUAPrefix } from './ReactEditorView/getUAPrefix';
 import { handleEditorFocus } from './ReactEditorView/handleEditorFocus';
 import { useDispatchTransaction } from './ReactEditorView/useDispatchTransaction';
@@ -484,6 +485,11 @@ export function ReactEditorView(props) {
           if (!liveDocWithContent || !fg('platform_editor_no_cursor_on_live_doc_init')) {
             focusTimeoutId.current = handleEditorFocus(editorView);
           }
+          if (expValEquals('platform_editor_no_cursor_on_edit_page_init', 'isEnabled', true) && fg('cc_editor_focus_before_editor_on_load')) {
+            if (!disabled && shouldFocus && !isEmptyDocument(editorView.state.doc)) {
+              focusEditorElement(editorId.current);
+            }
+          }
         }
       } else {
         var _liveDocWithContent = (__livePage || expValEquals('platform_editor_no_cursor_on_edit_page_init', 'isEnabled', true)) && !isEmptyDocument(editorView.state.doc);
@@ -492,7 +498,7 @@ export function ReactEditorView(props) {
         }
       }
     }
-  }, [editorView, shouldFocus, __livePage, mitigateScrollJump]);
+  }, [editorView, shouldFocus, __livePage, mitigateScrollJump, disabled]);
   var scrollElement = React.useRef();
   var possibleListeners = React.useRef([]);
   React.useEffect(function () {
@@ -609,6 +615,11 @@ export function ReactEditorView(props) {
               if (!isLivePageWithContent && shouldFocus && view.props.editable && view.props.editable(view.state)) {
                 focusTimeoutId.current = handleEditorFocus(view);
               }
+              if (expValEquals('platform_editor_no_cursor_on_edit_page_init', 'isEnabled', true) && fg('cc_editor_focus_before_editor_on_load')) {
+                if (shouldFocus && view.props.editable && view.props.editable(view.state) && !isEmptyDocument(view.state.doc)) {
+                  focusEditorElement(editorId.current);
+                }
+              }
             }
           } else {
             var _isLivePageWithContent = (__livePage || expValEquals('platform_editor_no_cursor_on_edit_page_init', 'isEnabled', true)) && !isEmptyDocument(view.state.doc) && fg('platform_editor_no_cursor_on_live_doc_init');
@@ -648,7 +659,11 @@ export function ReactEditorView(props) {
     }
   }, [createEditorView, onEditorCreated, eventDispatcher, shouldFocus, __livePage, onEditorDestroyed, handleAnalyticsEvent, mitigateScrollJump]);
   var createEditor = useCallback(function (assistiveLabel, assistiveDescribedBy) {
-    return /*#__PURE__*/React.createElement("div", {
+    return /*#__PURE__*/React.createElement(React.Fragment, null, fg('cc_editor_focus_before_editor_on_load') && /*#__PURE__*/React.createElement("div", {
+      tabIndex: -1,
+      "data-focus-id": editorId.current,
+      "data-testid": "react-editor-view-inital-focus-element"
+    }), /*#__PURE__*/React.createElement("div", {
       // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
       className: (expValEquals('platform_editor_stable_editorview_classname', 'isEnabled', true) ? 'ProseMirror ' : '') + getUAPrefix(),
       key: "ProseMirror",
@@ -665,7 +680,7 @@ export function ReactEditorView(props) {
       id: EDIT_AREA_ID,
       "aria-describedby": assistiveDescribedBy,
       "data-editor-id": editorId.current
-    });
+    }));
   }, [handleEditorViewRef, props.intl]);
   var previousPreset = usePreviousState(preset);
   useLayoutEffect(function () {
@@ -686,6 +701,11 @@ export function ReactEditorView(props) {
       if (!disabled && shouldFocus && !isLivePageWithContent) {
         focusTimeoutId.current = handleEditorFocus(viewRef.current);
       }
+      if (expValEquals('platform_editor_no_cursor_on_edit_page_init', 'isEnabled', true) && fg('cc_editor_focus_before_editor_on_load')) {
+        if (!disabled && shouldFocus && !isEmptyDocument(viewRef.current.state.doc)) {
+          focusEditorElement(editorId.current);
+        }
+      }
     }
   }, [disabled, shouldFocus, previousDisabledState, __livePage]);
   useFireFullWidthEvent(nextAppearance, dispatchAnalyticsEvent);

package/dist/esm/version-wrapper.js

@@ -1,2 +1,2 @@
 export var name = "@atlaskit/editor-core";
-export var version = "208.0.0";
+export var version = "208.1.0";

package/dist/types/composable-editor.d.ts

@@ -1 +1,2 @@
 export { ComposableEditor } from './composable-editor/composable-editor';
+export type { EditorNextProps } from './types/editor-props';

package/dist/types/create-editor/ReactEditorView/focusEditorElement.d.ts

@@ -0,0 +1 @@
+export declare function focusEditorElement(editorId: string): void;

package/dist/types-ts4.5/composable-editor.d.ts

@@ -1 +1,2 @@
 export { ComposableEditor } from './composable-editor/composable-editor';
+export type { EditorNextProps } from './types/editor-props';

package/dist/types-ts4.5/create-editor/ReactEditorView/focusEditorElement.d.ts

@@ -0,0 +1 @@
+export declare function focusEditorElement(editorId: string): void;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/editor-core",
-	"version": "208.0.1",
+	"version": "208.1.1",
 	"description": "A package contains Atlassian editor core functionality",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
@@ -105,7 +105,7 @@
 		"@atlaskit/primitives": "^14.9.0",
 		"@atlaskit/renderer": "^119.0.0",
 		"@atlaskit/section-message": "^8.2.0",
-		"@atlaskit/smart-card": "^38.10.0",
+		"@atlaskit/smart-card": "^38.11.0",
 		"@atlaskit/synchrony-test-helpers": "workspace:^",
 		"@atlaskit/toggle": "^15.0.0",
 		"@atlaskit/util-data-test": "^18.0.0",
@@ -556,10 +556,6 @@
 			"type": "boolean",
 			"referenceOnly": true
 		},
-		"platform_editor_controls_patch_8": {
-			"type": "boolean",
-			"referenceOnly": true
-		},
 		"platform_editor_controls_patch_9": {
 			"type": "boolean",
 			"referenceOnly": true
@@ -584,10 +580,6 @@
 			"type": "boolean",
 			"referenceOnly": true
 		},
-		"platform_editor_controls_table_picker": {
-			"type": "boolean",
-			"referenceOnly": true
-		},
 		"platform_editor_tables_table_selector": {
 			"type": "boolean",
 			"referenceOnly": true
@@ -640,6 +632,9 @@
 		},
 		"platform_editor_system_fake_text_highlight_colour": {
 			"type": "boolean"
+		},
+		"cc_editor_focus_before_editor_on_load": {
+			"type": "boolean"
 		}
 	},
 	"stricter": {