@atlaskit/editor-plugin-selection-marker 2.2.1 → 2.3.1
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,23 @@
|
|
|
1
1
|
# @atlaskit/editor-plugin-selection-marker
|
|
2
2
|
|
|
3
|
+
## 2.3.1
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- Updated dependencies
|
|
8
|
+
|
|
9
|
+
## 2.3.0
|
|
10
|
+
|
|
11
|
+
### Minor Changes
|
|
12
|
+
|
|
13
|
+
- [#150896](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/150896)
|
|
14
|
+
[`e3bd4fc83898b`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/e3bd4fc83898b) -
|
|
15
|
+
Used plugin selector conditionally behind feature flag
|
|
16
|
+
|
|
17
|
+
### Patch Changes
|
|
18
|
+
|
|
19
|
+
- Updated dependencies
|
|
20
|
+
|
|
3
21
|
## 2.2.1
|
|
4
22
|
|
|
5
23
|
### Patch Changes
|
|
@@ -13,6 +13,26 @@ var _main = require("./pm-plugins/main");
|
|
|
13
13
|
var _globalStyles = require("./ui/global-styles");
|
|
14
14
|
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
|
|
15
15
|
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
|
16
|
+
var useSharedState = (0, _hooks.sharedPluginStateHookMigratorFactory)(function (api) {
|
|
17
|
+
var hasFocus = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, 'focus.hasFocus');
|
|
18
|
+
var isOpen = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, 'typeAhead.isOpen');
|
|
19
|
+
var editorDisabled = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, 'editorDisabled.editorDisabled');
|
|
20
|
+
return {
|
|
21
|
+
hasFocus: hasFocus,
|
|
22
|
+
isOpen: isOpen,
|
|
23
|
+
editorDisabled: editorDisabled
|
|
24
|
+
};
|
|
25
|
+
}, function (api) {
|
|
26
|
+
var _useSharedPluginState = (0, _hooks.useSharedPluginState)(api, ['focus', 'typeAhead', 'editorDisabled']),
|
|
27
|
+
focusState = _useSharedPluginState.focusState,
|
|
28
|
+
typeAheadState = _useSharedPluginState.typeAheadState,
|
|
29
|
+
editorDisabledState = _useSharedPluginState.editorDisabledState;
|
|
30
|
+
return {
|
|
31
|
+
hasFocus: focusState === null || focusState === void 0 ? void 0 : focusState.hasFocus,
|
|
32
|
+
isOpen: typeAheadState === null || typeAheadState === void 0 ? void 0 : typeAheadState.isOpen,
|
|
33
|
+
editorDisabled: editorDisabledState === null || editorDisabledState === void 0 ? void 0 : editorDisabledState.editorDisabled
|
|
34
|
+
};
|
|
35
|
+
});
|
|
16
36
|
var selectionMarkerPlugin = exports.selectionMarkerPlugin = function selectionMarkerPlugin(_ref) {
|
|
17
37
|
var config = _ref.config,
|
|
18
38
|
api = _ref.api;
|
|
@@ -80,19 +100,19 @@ var selectionMarkerPlugin = exports.selectionMarkerPlugin = function selectionMa
|
|
|
80
100
|
// relatch when editorView changes (pretty good signal for reinit)
|
|
81
101
|
editorHasNotBeenFocused.current = true;
|
|
82
102
|
}, [editorView]);
|
|
83
|
-
var
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
103
|
+
var _useSharedState = useSharedState(api),
|
|
104
|
+
hasFocus = _useSharedState.hasFocus,
|
|
105
|
+
isOpen = _useSharedState.isOpen,
|
|
106
|
+
editorDisabled = _useSharedState.editorDisabled;
|
|
87
107
|
var isForcedHidden = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, 'selectionMarker.isForcedHidden');
|
|
88
108
|
(0, _react.useEffect)(function () {
|
|
89
109
|
if ((0, _platformFeatureFlags.fg)('platform_editor_no_cursor_on_live_doc_init')) {
|
|
90
|
-
var _ref5
|
|
110
|
+
var _ref5;
|
|
91
111
|
// On editor init we should use this latch to keep the marker hidden until
|
|
92
112
|
// editor has received focus. This means editor will be initially hidden until
|
|
93
113
|
// the first focus occurs, and after first focus the normal above rules will
|
|
94
114
|
// apply
|
|
95
|
-
if (
|
|
115
|
+
if (hasFocus === true) {
|
|
96
116
|
editorHasNotBeenFocused.current = false;
|
|
97
117
|
}
|
|
98
118
|
|
|
@@ -104,12 +124,12 @@ var selectionMarkerPlugin = exports.selectionMarkerPlugin = function selectionMa
|
|
|
104
124
|
* - Disabled: So that it behaves similar to the renderer in live pages/disabled
|
|
105
125
|
* - Via the API: If another plugin has requested it to be hidden (force hidden).
|
|
106
126
|
*/
|
|
107
|
-
var shouldHide = (_ref5 = (config === null || config === void 0 ? void 0 : config.hideCursorOnInit) && editorHasNotBeenFocused.current ||
|
|
127
|
+
var shouldHide = (_ref5 = (config === null || config === void 0 ? void 0 : config.hideCursorOnInit) && editorHasNotBeenFocused.current || hasFocus || (isOpen !== null && isOpen !== void 0 ? isOpen : false) || isForcedHidden || (editorDisabled !== null && editorDisabled !== void 0 ? editorDisabled : false)) !== null && _ref5 !== void 0 ? _ref5 : true;
|
|
108
128
|
requestAnimationFrame(function () {
|
|
109
129
|
return (0, _main.dispatchShouldHideDecorations)(editorView, shouldHide);
|
|
110
130
|
});
|
|
111
131
|
} else {
|
|
112
|
-
var _ref6
|
|
132
|
+
var _ref6;
|
|
113
133
|
/**
|
|
114
134
|
* There are a number of conditions we should not show the marker,
|
|
115
135
|
* - Focus: to ensure it doesn't interrupt the normal cursor
|
|
@@ -117,12 +137,12 @@ var selectionMarkerPlugin = exports.selectionMarkerPlugin = function selectionMa
|
|
|
117
137
|
* - Disabled: So that it behaves similar to the renderer in live pages/disabled
|
|
118
138
|
* - Via the API: If another plugin has requested it to be hidden (force hidden).
|
|
119
139
|
*/
|
|
120
|
-
var _shouldHide = (_ref6 =
|
|
140
|
+
var _shouldHide = (_ref6 = hasFocus || (isOpen !== null && isOpen !== void 0 ? isOpen : false) || isForcedHidden || (editorDisabled !== null && editorDisabled !== void 0 ? editorDisabled : false)) !== null && _ref6 !== void 0 ? _ref6 : true;
|
|
121
141
|
requestAnimationFrame(function () {
|
|
122
142
|
return (0, _main.dispatchShouldHideDecorations)(editorView, _shouldHide);
|
|
123
143
|
});
|
|
124
144
|
}
|
|
125
|
-
}, [editorView,
|
|
145
|
+
}, [editorView, hasFocus, isOpen, isForcedHidden, editorDisabled]);
|
|
126
146
|
},
|
|
127
147
|
contentComponent: function contentComponent() {
|
|
128
148
|
return /*#__PURE__*/_react.default.createElement(_globalStyles.GlobalStylesWrapper, null);
|
|
@@ -1,9 +1,30 @@
|
|
|
1
1
|
import React, { useEffect, useRef } from 'react';
|
|
2
|
-
import { useSharedPluginState } from '@atlaskit/editor-common/hooks';
|
|
2
|
+
import { useSharedPluginState, sharedPluginStateHookMigratorFactory } from '@atlaskit/editor-common/hooks';
|
|
3
3
|
import { useSharedPluginStateSelector } from '@atlaskit/editor-common/use-shared-plugin-state-selector';
|
|
4
4
|
import { fg } from '@atlaskit/platform-feature-flags';
|
|
5
5
|
import { createPlugin, dispatchShouldHideDecorations, key } from './pm-plugins/main';
|
|
6
6
|
import { GlobalStylesWrapper } from './ui/global-styles';
|
|
7
|
+
const useSharedState = sharedPluginStateHookMigratorFactory(api => {
|
|
8
|
+
const hasFocus = useSharedPluginStateSelector(api, 'focus.hasFocus');
|
|
9
|
+
const isOpen = useSharedPluginStateSelector(api, 'typeAhead.isOpen');
|
|
10
|
+
const editorDisabled = useSharedPluginStateSelector(api, 'editorDisabled.editorDisabled');
|
|
11
|
+
return {
|
|
12
|
+
hasFocus,
|
|
13
|
+
isOpen,
|
|
14
|
+
editorDisabled
|
|
15
|
+
};
|
|
16
|
+
}, api => {
|
|
17
|
+
const {
|
|
18
|
+
focusState,
|
|
19
|
+
typeAheadState,
|
|
20
|
+
editorDisabledState
|
|
21
|
+
} = useSharedPluginState(api, ['focus', 'typeAhead', 'editorDisabled']);
|
|
22
|
+
return {
|
|
23
|
+
hasFocus: focusState === null || focusState === void 0 ? void 0 : focusState.hasFocus,
|
|
24
|
+
isOpen: typeAheadState === null || typeAheadState === void 0 ? void 0 : typeAheadState.isOpen,
|
|
25
|
+
editorDisabled: editorDisabledState === null || editorDisabledState === void 0 ? void 0 : editorDisabledState.editorDisabled
|
|
26
|
+
};
|
|
27
|
+
});
|
|
7
28
|
export const selectionMarkerPlugin = ({
|
|
8
29
|
config,
|
|
9
30
|
api
|
|
@@ -72,19 +93,19 @@ export const selectionMarkerPlugin = ({
|
|
|
72
93
|
editorHasNotBeenFocused.current = true;
|
|
73
94
|
}, [editorView]);
|
|
74
95
|
const {
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
} =
|
|
96
|
+
hasFocus,
|
|
97
|
+
isOpen,
|
|
98
|
+
editorDisabled
|
|
99
|
+
} = useSharedState(api);
|
|
79
100
|
const isForcedHidden = useSharedPluginStateSelector(api, 'selectionMarker.isForcedHidden');
|
|
80
101
|
useEffect(() => {
|
|
81
102
|
if (fg('platform_editor_no_cursor_on_live_doc_init')) {
|
|
82
|
-
var _ref
|
|
103
|
+
var _ref;
|
|
83
104
|
// On editor init we should use this latch to keep the marker hidden until
|
|
84
105
|
// editor has received focus. This means editor will be initially hidden until
|
|
85
106
|
// the first focus occurs, and after first focus the normal above rules will
|
|
86
107
|
// apply
|
|
87
|
-
if (
|
|
108
|
+
if (hasFocus === true) {
|
|
88
109
|
editorHasNotBeenFocused.current = false;
|
|
89
110
|
}
|
|
90
111
|
|
|
@@ -96,10 +117,10 @@ export const selectionMarkerPlugin = ({
|
|
|
96
117
|
* - Disabled: So that it behaves similar to the renderer in live pages/disabled
|
|
97
118
|
* - Via the API: If another plugin has requested it to be hidden (force hidden).
|
|
98
119
|
*/
|
|
99
|
-
const shouldHide = (_ref = (config === null || config === void 0 ? void 0 : config.hideCursorOnInit) && editorHasNotBeenFocused.current ||
|
|
120
|
+
const shouldHide = (_ref = (config === null || config === void 0 ? void 0 : config.hideCursorOnInit) && editorHasNotBeenFocused.current || hasFocus || (isOpen !== null && isOpen !== void 0 ? isOpen : false) || isForcedHidden || (editorDisabled !== null && editorDisabled !== void 0 ? editorDisabled : false)) !== null && _ref !== void 0 ? _ref : true;
|
|
100
121
|
requestAnimationFrame(() => dispatchShouldHideDecorations(editorView, shouldHide));
|
|
101
122
|
} else {
|
|
102
|
-
var _ref2
|
|
123
|
+
var _ref2;
|
|
103
124
|
/**
|
|
104
125
|
* There are a number of conditions we should not show the marker,
|
|
105
126
|
* - Focus: to ensure it doesn't interrupt the normal cursor
|
|
@@ -107,10 +128,10 @@ export const selectionMarkerPlugin = ({
|
|
|
107
128
|
* - Disabled: So that it behaves similar to the renderer in live pages/disabled
|
|
108
129
|
* - Via the API: If another plugin has requested it to be hidden (force hidden).
|
|
109
130
|
*/
|
|
110
|
-
const shouldHide = (_ref2 =
|
|
131
|
+
const shouldHide = (_ref2 = hasFocus || (isOpen !== null && isOpen !== void 0 ? isOpen : false) || isForcedHidden || (editorDisabled !== null && editorDisabled !== void 0 ? editorDisabled : false)) !== null && _ref2 !== void 0 ? _ref2 : true;
|
|
111
132
|
requestAnimationFrame(() => dispatchShouldHideDecorations(editorView, shouldHide));
|
|
112
133
|
}
|
|
113
|
-
}, [editorView,
|
|
134
|
+
}, [editorView, hasFocus, isOpen, isForcedHidden, editorDisabled]);
|
|
114
135
|
},
|
|
115
136
|
contentComponent() {
|
|
116
137
|
return /*#__PURE__*/React.createElement(GlobalStylesWrapper, null);
|
|
@@ -1,9 +1,29 @@
|
|
|
1
1
|
import React, { useEffect, useRef } from 'react';
|
|
2
|
-
import { useSharedPluginState } from '@atlaskit/editor-common/hooks';
|
|
2
|
+
import { useSharedPluginState, sharedPluginStateHookMigratorFactory } from '@atlaskit/editor-common/hooks';
|
|
3
3
|
import { useSharedPluginStateSelector } from '@atlaskit/editor-common/use-shared-plugin-state-selector';
|
|
4
4
|
import { fg } from '@atlaskit/platform-feature-flags';
|
|
5
5
|
import { createPlugin, dispatchShouldHideDecorations, key } from './pm-plugins/main';
|
|
6
6
|
import { GlobalStylesWrapper } from './ui/global-styles';
|
|
7
|
+
var useSharedState = sharedPluginStateHookMigratorFactory(function (api) {
|
|
8
|
+
var hasFocus = useSharedPluginStateSelector(api, 'focus.hasFocus');
|
|
9
|
+
var isOpen = useSharedPluginStateSelector(api, 'typeAhead.isOpen');
|
|
10
|
+
var editorDisabled = useSharedPluginStateSelector(api, 'editorDisabled.editorDisabled');
|
|
11
|
+
return {
|
|
12
|
+
hasFocus: hasFocus,
|
|
13
|
+
isOpen: isOpen,
|
|
14
|
+
editorDisabled: editorDisabled
|
|
15
|
+
};
|
|
16
|
+
}, function (api) {
|
|
17
|
+
var _useSharedPluginState = useSharedPluginState(api, ['focus', 'typeAhead', 'editorDisabled']),
|
|
18
|
+
focusState = _useSharedPluginState.focusState,
|
|
19
|
+
typeAheadState = _useSharedPluginState.typeAheadState,
|
|
20
|
+
editorDisabledState = _useSharedPluginState.editorDisabledState;
|
|
21
|
+
return {
|
|
22
|
+
hasFocus: focusState === null || focusState === void 0 ? void 0 : focusState.hasFocus,
|
|
23
|
+
isOpen: typeAheadState === null || typeAheadState === void 0 ? void 0 : typeAheadState.isOpen,
|
|
24
|
+
editorDisabled: editorDisabledState === null || editorDisabledState === void 0 ? void 0 : editorDisabledState.editorDisabled
|
|
25
|
+
};
|
|
26
|
+
});
|
|
7
27
|
export var selectionMarkerPlugin = function selectionMarkerPlugin(_ref) {
|
|
8
28
|
var config = _ref.config,
|
|
9
29
|
api = _ref.api;
|
|
@@ -71,19 +91,19 @@ export var selectionMarkerPlugin = function selectionMarkerPlugin(_ref) {
|
|
|
71
91
|
// relatch when editorView changes (pretty good signal for reinit)
|
|
72
92
|
editorHasNotBeenFocused.current = true;
|
|
73
93
|
}, [editorView]);
|
|
74
|
-
var
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
94
|
+
var _useSharedState = useSharedState(api),
|
|
95
|
+
hasFocus = _useSharedState.hasFocus,
|
|
96
|
+
isOpen = _useSharedState.isOpen,
|
|
97
|
+
editorDisabled = _useSharedState.editorDisabled;
|
|
78
98
|
var isForcedHidden = useSharedPluginStateSelector(api, 'selectionMarker.isForcedHidden');
|
|
79
99
|
useEffect(function () {
|
|
80
100
|
if (fg('platform_editor_no_cursor_on_live_doc_init')) {
|
|
81
|
-
var _ref5
|
|
101
|
+
var _ref5;
|
|
82
102
|
// On editor init we should use this latch to keep the marker hidden until
|
|
83
103
|
// editor has received focus. This means editor will be initially hidden until
|
|
84
104
|
// the first focus occurs, and after first focus the normal above rules will
|
|
85
105
|
// apply
|
|
86
|
-
if (
|
|
106
|
+
if (hasFocus === true) {
|
|
87
107
|
editorHasNotBeenFocused.current = false;
|
|
88
108
|
}
|
|
89
109
|
|
|
@@ -95,12 +115,12 @@ export var selectionMarkerPlugin = function selectionMarkerPlugin(_ref) {
|
|
|
95
115
|
* - Disabled: So that it behaves similar to the renderer in live pages/disabled
|
|
96
116
|
* - Via the API: If another plugin has requested it to be hidden (force hidden).
|
|
97
117
|
*/
|
|
98
|
-
var shouldHide = (_ref5 = (config === null || config === void 0 ? void 0 : config.hideCursorOnInit) && editorHasNotBeenFocused.current ||
|
|
118
|
+
var shouldHide = (_ref5 = (config === null || config === void 0 ? void 0 : config.hideCursorOnInit) && editorHasNotBeenFocused.current || hasFocus || (isOpen !== null && isOpen !== void 0 ? isOpen : false) || isForcedHidden || (editorDisabled !== null && editorDisabled !== void 0 ? editorDisabled : false)) !== null && _ref5 !== void 0 ? _ref5 : true;
|
|
99
119
|
requestAnimationFrame(function () {
|
|
100
120
|
return dispatchShouldHideDecorations(editorView, shouldHide);
|
|
101
121
|
});
|
|
102
122
|
} else {
|
|
103
|
-
var _ref6
|
|
123
|
+
var _ref6;
|
|
104
124
|
/**
|
|
105
125
|
* There are a number of conditions we should not show the marker,
|
|
106
126
|
* - Focus: to ensure it doesn't interrupt the normal cursor
|
|
@@ -108,12 +128,12 @@ export var selectionMarkerPlugin = function selectionMarkerPlugin(_ref) {
|
|
|
108
128
|
* - Disabled: So that it behaves similar to the renderer in live pages/disabled
|
|
109
129
|
* - Via the API: If another plugin has requested it to be hidden (force hidden).
|
|
110
130
|
*/
|
|
111
|
-
var _shouldHide = (_ref6 =
|
|
131
|
+
var _shouldHide = (_ref6 = hasFocus || (isOpen !== null && isOpen !== void 0 ? isOpen : false) || isForcedHidden || (editorDisabled !== null && editorDisabled !== void 0 ? editorDisabled : false)) !== null && _ref6 !== void 0 ? _ref6 : true;
|
|
112
132
|
requestAnimationFrame(function () {
|
|
113
133
|
return dispatchShouldHideDecorations(editorView, _shouldHide);
|
|
114
134
|
});
|
|
115
135
|
}
|
|
116
|
-
}, [editorView,
|
|
136
|
+
}, [editorView, hasFocus, isOpen, isForcedHidden, editorDisabled]);
|
|
117
137
|
},
|
|
118
138
|
contentComponent: function contentComponent() {
|
|
119
139
|
return /*#__PURE__*/React.createElement(GlobalStylesWrapper, null);
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/editor-plugin-selection-marker",
|
|
3
|
-
"version": "2.
|
|
3
|
+
"version": "2.3.1",
|
|
4
4
|
"description": "Selection marker plugin for @atlaskit/editor-core.",
|
|
5
5
|
"author": "Atlassian Pty Ltd",
|
|
6
6
|
"license": "Apache-2.0",
|
|
@@ -31,7 +31,7 @@
|
|
|
31
31
|
".": "./src/index.ts"
|
|
32
32
|
},
|
|
33
33
|
"dependencies": {
|
|
34
|
-
"@atlaskit/editor-common": "^
|
|
34
|
+
"@atlaskit/editor-common": "^105.0.0",
|
|
35
35
|
"@atlaskit/editor-plugin-editor-disabled": "^2.0.0",
|
|
36
36
|
"@atlaskit/editor-plugin-focus": "^1.5.0",
|
|
37
37
|
"@atlaskit/editor-plugin-type-ahead": "^2.6.0",
|
|
@@ -39,7 +39,7 @@
|
|
|
39
39
|
"@atlaskit/platform-feature-flags": "^1.1.0",
|
|
40
40
|
"@atlaskit/primitives": "^14.7.0",
|
|
41
41
|
"@atlaskit/theme": "^18.0.0",
|
|
42
|
-
"@atlaskit/tmp-editor-statsig": "^4.
|
|
42
|
+
"@atlaskit/tmp-editor-statsig": "^4.19.0",
|
|
43
43
|
"@atlaskit/tokens": "^4.8.0",
|
|
44
44
|
"@babel/runtime": "^7.0.0",
|
|
45
45
|
"@emotion/react": "^11.7.1",
|