@atlaskit/editor-plugin-type-ahead 2.0.2 → 2.0.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md CHANGED
@@ -1,5 +1,13 @@
1
1
  # @atlaskit/editor-plugin-type-ahead
2
2
 
3
+ ## 2.0.3
4
+
5
+ ### Patch Changes
6
+
7
+ - [#120431](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/120431)
8
+ [`17173ce340cdc`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/17173ce340cdc) -
9
+ [ED-26763] Support inserting selected item by Enter
10
+
3
11
  ## 2.0.2
4
12
 
5
13
  ### Patch Changes
@@ -8,6 +8,7 @@ exports.TypeAheadMenu = void 0;
8
8
  var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
9
9
  var _react = _interopRequireDefault(require("react"));
10
10
  var _typeAhead = require("@atlaskit/editor-common/type-ahead");
11
+ var _updateSelectedIndex = require("../../pm-plugins/commands/update-selected-index");
11
12
  var _useItemInsert3 = require("../hooks/use-item-insert");
12
13
  var _TypeAheadPopup = require("./TypeAheadPopup");
13
14
  var TypeAheadMenu = exports.TypeAheadMenu = /*#__PURE__*/_react.default.memo(function (_ref) {
@@ -30,6 +31,12 @@ var TypeAheadMenu = exports.TypeAheadMenu = /*#__PURE__*/_react.default.memo(fun
30
31
  _useItemInsert2 = (0, _slicedToArray2.default)(_useItemInsert, 2),
31
32
  onItemInsert = _useItemInsert2[0],
32
33
  onTextInsert = _useItemInsert2[1];
34
+ var setSelectedItem = _react.default.useCallback(function (_ref2) {
35
+ var nextIndex = _ref2.index;
36
+ queueMicrotask(function () {
37
+ (0, _updateSelectedIndex.updateSelectedIndex)(nextIndex, api)(editorView.state, editorView.dispatch);
38
+ });
39
+ }, [editorView, api]);
33
40
  var insertItem = _react.default.useCallback(function () {
34
41
  var mode = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : _typeAhead.SelectItemMode.SELECTED;
35
42
  var index = arguments.length > 1 ? arguments[1] : undefined;
@@ -41,10 +48,10 @@ var TypeAheadMenu = exports.TypeAheadMenu = /*#__PURE__*/_react.default.memo(fun
41
48
  });
42
49
  });
43
50
  }, [onItemInsert, query]);
44
- var cancel = _react.default.useCallback(function (_ref2) {
45
- var setSelectionAt = _ref2.setSelectionAt,
46
- addPrefixTrigger = _ref2.addPrefixTrigger,
47
- forceFocusOnEditor = _ref2.forceFocusOnEditor;
51
+ var cancel = _react.default.useCallback(function (_ref3) {
52
+ var setSelectionAt = _ref3.setSelectionAt,
53
+ addPrefixTrigger = _ref3.addPrefixTrigger,
54
+ forceFocusOnEditor = _ref3.forceFocusOnEditor;
48
55
  var fullQuery = addPrefixTrigger ? "".concat(triggerHandler === null || triggerHandler === void 0 ? void 0 : triggerHandler.trigger).concat(query) : query;
49
56
  onTextInsert({
50
57
  forceFocusOnEditor: forceFocusOnEditor,
@@ -65,8 +72,8 @@ var TypeAheadMenu = exports.TypeAheadMenu = /*#__PURE__*/_react.default.memo(fun
65
72
  items: items,
66
73
  errorInfo: errorInfo
67
74
  // selectedIndex={selectedIndex}
68
- // setSelectedItem={setSelectedItem}
69
75
  ,
76
+ setSelectedItem: setSelectedItem,
70
77
  onItemInsert: insertItem,
71
78
  decorationSet: decorationSet,
72
79
  isEmptyQuery: !query,
@@ -60,7 +60,8 @@ var TypeAheadPopup = exports.TypeAheadPopup = /*#__PURE__*/_react.default.memo(f
60
60
  isEmptyQuery = props.isEmptyQuery,
61
61
  cancel = props.cancel,
62
62
  api = props.api,
63
- query = props.query;
63
+ query = props.query,
64
+ setSelectedItem = props.setSelectedItem;
64
65
  var ref = (0, _react.useRef)(null);
65
66
  var defaultMenuHeight = DEFAULT_TYPEAHEAD_MENU_HEIGHT;
66
67
  var startTime = (0, _react.useMemo)(function () {
@@ -293,7 +294,8 @@ var TypeAheadPopup = exports.TypeAheadPopup = /*#__PURE__*/_react.default.memo(f
293
294
  }, errorInfo ? (0, _react2.jsx)(_TypeAheadErrorFallback.TypeAheadErrorFallback, null) : (0, _react2.jsx)(_react.default.Fragment, null, (0, _react2.jsx)(_editorElementBrowser.QuickInsertPanel, {
294
295
  items: items,
295
296
  onItemInsert: onItemInsert,
296
- query: query
297
+ query: query,
298
+ setSelectedItem: setSelectedItem
297
299
  }), (api === null || api === void 0 ? void 0 : api.contextPanel) && (0, _react2.jsx)(_ViewAllButton.ViewAllButton, {
298
300
  items: items,
299
301
  editorApi: api,
@@ -1,5 +1,6 @@
1
1
  import React from 'react';
2
2
  import { SelectItemMode } from '@atlaskit/editor-common/type-ahead';
3
+ import { updateSelectedIndex } from '../../pm-plugins/commands/update-selected-index';
3
4
  import { useItemInsert } from '../hooks/use-item-insert';
4
5
  import { TypeAheadPopup as TypeAheadPopupModern } from './TypeAheadPopup';
5
6
  export const TypeAheadMenu = /*#__PURE__*/React.memo(({
@@ -22,6 +23,13 @@ export const TypeAheadMenu = /*#__PURE__*/React.memo(({
22
23
  // Ignored via go/ees005
23
24
  // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
24
25
  triggerHandler, editorView, items, api);
26
+ const setSelectedItem = React.useCallback(({
27
+ index: nextIndex
28
+ }) => {
29
+ queueMicrotask(() => {
30
+ updateSelectedIndex(nextIndex, api)(editorView.state, editorView.dispatch);
31
+ });
32
+ }, [editorView, api]);
25
33
  const insertItem = React.useCallback((mode = SelectItemMode.SELECTED, index) => {
26
34
  queueMicrotask(() => {
27
35
  onItemInsert({
@@ -56,8 +64,8 @@ export const TypeAheadMenu = /*#__PURE__*/React.memo(({
56
64
  items: items,
57
65
  errorInfo: errorInfo
58
66
  // selectedIndex={selectedIndex}
59
- // setSelectedItem={setSelectedItem}
60
67
  ,
68
+ setSelectedItem: setSelectedItem,
61
69
  onItemInsert: insertItem,
62
70
  decorationSet: decorationSet,
63
71
  isEmptyQuery: !query,
@@ -49,7 +49,8 @@ export const TypeAheadPopup = /*#__PURE__*/React.memo(props => {
49
49
  isEmptyQuery,
50
50
  cancel,
51
51
  api,
52
- query
52
+ query,
53
+ setSelectedItem
53
54
  } = props;
54
55
  const ref = useRef(null);
55
56
  const defaultMenuHeight = DEFAULT_TYPEAHEAD_MENU_HEIGHT;
@@ -284,7 +285,8 @@ export const TypeAheadPopup = /*#__PURE__*/React.memo(props => {
284
285
  }, errorInfo ? jsx(TypeAheadErrorFallback, null) : jsx(React.Fragment, null, jsx(QuickInsertPanel, {
285
286
  items: items,
286
287
  onItemInsert: onItemInsert,
287
- query: query
288
+ query: query,
289
+ setSelectedItem: setSelectedItem
288
290
  }), (api === null || api === void 0 ? void 0 : api.contextPanel) && jsx(ViewAllButton, {
289
291
  items: items,
290
292
  editorApi: api,
@@ -1,6 +1,7 @@
1
1
  import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
2
2
  import React from 'react';
3
3
  import { SelectItemMode } from '@atlaskit/editor-common/type-ahead';
4
+ import { updateSelectedIndex } from '../../pm-plugins/commands/update-selected-index';
4
5
  import { useItemInsert } from '../hooks/use-item-insert';
5
6
  import { TypeAheadPopup as TypeAheadPopupModern } from './TypeAheadPopup';
6
7
  export var TypeAheadMenu = /*#__PURE__*/React.memo(function (_ref) {
@@ -23,6 +24,12 @@ export var TypeAheadMenu = /*#__PURE__*/React.memo(function (_ref) {
23
24
  _useItemInsert2 = _slicedToArray(_useItemInsert, 2),
24
25
  onItemInsert = _useItemInsert2[0],
25
26
  onTextInsert = _useItemInsert2[1];
27
+ var setSelectedItem = React.useCallback(function (_ref2) {
28
+ var nextIndex = _ref2.index;
29
+ queueMicrotask(function () {
30
+ updateSelectedIndex(nextIndex, api)(editorView.state, editorView.dispatch);
31
+ });
32
+ }, [editorView, api]);
26
33
  var insertItem = React.useCallback(function () {
27
34
  var mode = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : SelectItemMode.SELECTED;
28
35
  var index = arguments.length > 1 ? arguments[1] : undefined;
@@ -34,10 +41,10 @@ export var TypeAheadMenu = /*#__PURE__*/React.memo(function (_ref) {
34
41
  });
35
42
  });
36
43
  }, [onItemInsert, query]);
37
- var cancel = React.useCallback(function (_ref2) {
38
- var setSelectionAt = _ref2.setSelectionAt,
39
- addPrefixTrigger = _ref2.addPrefixTrigger,
40
- forceFocusOnEditor = _ref2.forceFocusOnEditor;
44
+ var cancel = React.useCallback(function (_ref3) {
45
+ var setSelectionAt = _ref3.setSelectionAt,
46
+ addPrefixTrigger = _ref3.addPrefixTrigger,
47
+ forceFocusOnEditor = _ref3.forceFocusOnEditor;
41
48
  var fullQuery = addPrefixTrigger ? "".concat(triggerHandler === null || triggerHandler === void 0 ? void 0 : triggerHandler.trigger).concat(query) : query;
42
49
  onTextInsert({
43
50
  forceFocusOnEditor: forceFocusOnEditor,
@@ -58,8 +65,8 @@ export var TypeAheadMenu = /*#__PURE__*/React.memo(function (_ref) {
58
65
  items: items,
59
66
  errorInfo: errorInfo
60
67
  // selectedIndex={selectedIndex}
61
- // setSelectedItem={setSelectedItem}
62
68
  ,
69
+ setSelectedItem: setSelectedItem,
63
70
  onItemInsert: insertItem,
64
71
  decorationSet: decorationSet,
65
72
  isEmptyQuery: !query,
@@ -49,7 +49,8 @@ export var TypeAheadPopup = /*#__PURE__*/React.memo(function (props) {
49
49
  isEmptyQuery = props.isEmptyQuery,
50
50
  cancel = props.cancel,
51
51
  api = props.api,
52
- query = props.query;
52
+ query = props.query,
53
+ setSelectedItem = props.setSelectedItem;
53
54
  var ref = useRef(null);
54
55
  var defaultMenuHeight = DEFAULT_TYPEAHEAD_MENU_HEIGHT;
55
56
  var startTime = useMemo(function () {
@@ -282,7 +283,8 @@ export var TypeAheadPopup = /*#__PURE__*/React.memo(function (props) {
282
283
  }, errorInfo ? jsx(TypeAheadErrorFallback, null) : jsx(React.Fragment, null, jsx(QuickInsertPanel, {
283
284
  items: items,
284
285
  onItemInsert: onItemInsert,
285
- query: query
286
+ query: query,
287
+ setSelectedItem: setSelectedItem
286
288
  }), (api === null || api === void 0 ? void 0 : api.contextPanel) && jsx(ViewAllButton, {
287
289
  items: items,
288
290
  editorApi: api,
@@ -29,6 +29,9 @@ type TypeAheadPopupProps = {
29
29
  forceFocusOnEditor: boolean;
30
30
  }) => void;
31
31
  api: ExtractInjectionAPI<TypeAheadPlugin> | undefined;
32
+ setSelectedItem?: (props: {
33
+ index: number;
34
+ }) => void;
32
35
  };
33
36
  export declare const TypeAheadPopup: React.MemoExoticComponent<(props: TypeAheadPopupProps) => jsx.JSX.Element>;
34
37
  export {};
@@ -29,6 +29,9 @@ type TypeAheadPopupProps = {
29
29
  forceFocusOnEditor: boolean;
30
30
  }) => void;
31
31
  api: ExtractInjectionAPI<TypeAheadPlugin> | undefined;
32
+ setSelectedItem?: (props: {
33
+ index: number;
34
+ }) => void;
32
35
  };
33
36
  export declare const TypeAheadPopup: React.MemoExoticComponent<(props: TypeAheadPopupProps) => jsx.JSX.Element>;
34
37
  export {};
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-plugin-type-ahead",
3
- "version": "2.0.2",
3
+ "version": "2.0.3",
4
4
  "description": "Type-ahead plugin for @atlaskit/editor-core",
5
5
  "author": "Atlassian Pty Ltd",
6
6
  "license": "Apache-2.0",
@@ -32,7 +32,7 @@
32
32
  },
33
33
  "dependencies": {
34
34
  "@atlaskit/adf-schema": "^47.2.1",
35
- "@atlaskit/editor-common": "^100.2.0",
35
+ "@atlaskit/editor-common": "^100.4.0",
36
36
  "@atlaskit/editor-element-browser": "^0.1.0",
37
37
  "@atlaskit/editor-plugin-analytics": "^2.0.0",
38
38
  "@atlaskit/editor-plugin-connectivity": "^2.0.0",