@atlaskit/editor-plugin-find-replace 2.8.0 → 2.10.0

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.
Files changed (18) hide show
  1. package/CHANGELOG.md +17 -0
  2. package/dist/cjs/pm-plugins/commands.js +2 -2
  3. package/dist/cjs/pm-plugins/plugin-factory.js +2 -1
  4. package/dist/cjs/pm-plugins/utils/index.js +47 -40
  5. package/dist/cjs/ui/styles.js +71 -18
  6. package/dist/es2019/pm-plugins/commands.js +2 -2
  7. package/dist/es2019/pm-plugins/plugin-factory.js +2 -1
  8. package/dist/es2019/pm-plugins/utils/index.js +51 -43
  9. package/dist/es2019/ui/styles.js +101 -11
  10. package/dist/esm/pm-plugins/commands.js +2 -2
  11. package/dist/esm/pm-plugins/plugin-factory.js +2 -1
  12. package/dist/esm/pm-plugins/utils/index.js +47 -40
  13. package/dist/esm/ui/styles.js +70 -15
  14. package/dist/types/pm-plugins/utils/index.d.ts +1 -1
  15. package/dist/types/ui/styles.d.ts +3 -0
  16. package/dist/types-ts4.5/pm-plugins/utils/index.d.ts +1 -1
  17. package/dist/types-ts4.5/ui/styles.d.ts +3 -0
  18. package/package.json +2 -2
package/CHANGELOG.md CHANGED
@@ -1,5 +1,22 @@
1
1
  # @atlaskit/editor-plugin-find-replace
2
2
 
3
+ ## 2.10.0
4
+
5
+ ### Minor Changes
6
+
7
+ - [#175370](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/175370)
8
+ [`fb5f9531ef9d8`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/fb5f9531ef9d8) -
9
+ [ux] [ED-27956] this PR is adding support for Find with expand titles and updating the search
10
+ match styles behind the experiment `platform_editor_find_and_replace_improvements`
11
+
12
+ ## 2.9.0
13
+
14
+ ### Minor Changes
15
+
16
+ - [#177117](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/177117)
17
+ [`49ae44aea25fc`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/49ae44aea25fc) -
18
+ Add new styles for inline nodes for find and replace, include these in block node checks
19
+
3
20
  ## 2.8.0
4
21
 
5
22
  ### Minor Changes
package/dist/cjs/pm-plugins/commands.js CHANGED
@@ -278,10 +278,10 @@ var updateSelectedHighlight = function updateSelectedHighlight(state, nextSelect
278
278
  decorationSet = (0, _utils.removeDecorationsFromSet)(decorationSet, decorationsToRemove, state.doc);
279
279
  }
280
280
  if (currentSelectedMatch) {
281
- decorationSet = decorationSet.add(state.doc, [(0, _utils.createDecoration)(currentSelectedMatch.start, currentSelectedMatch.end, false, (0, _expValEquals.expValEquals)('platform_editor_find_and_replace_improvements', 'isEnabled', true) ? currentSelectedMatch.nodeType : undefined)]);
281
+ decorationSet = decorationSet.add(state.doc, [(0, _utils.createDecoration)(currentSelectedMatch)]);
282
282
  }
283
283
  if (nextSelectedMatch) {
284
- decorationSet = decorationSet.add(state.doc, [(0, _utils.createDecoration)(nextSelectedMatch.start, nextSelectedMatch.end, true, (0, _expValEquals.expValEquals)('platform_editor_find_and_replace_improvements', 'isEnabled', true) ? nextSelectedMatch.nodeType : undefined)]);
284
+ decorationSet = decorationSet.add(state.doc, [(0, _utils.createDecoration)(nextSelectedMatch, true)]);
285
285
  }
286
286
  return decorationSet;
287
287
  };
package/dist/cjs/pm-plugins/plugin-factory.js CHANGED
@@ -49,7 +49,8 @@ var handleDocChanged = function handleDocChanged(tr, pluginState) {
49
49
  return {
50
50
  start: tr.mapping.map(match.start),
51
51
  end: tr.mapping.map(match.end),
52
- canReplace: match.canReplace
52
+ canReplace: match.canReplace,
53
+ nodeType: match.nodeType
53
54
  };
54
55
  });
55
56
  var matchesToAdd = [];
package/dist/cjs/pm-plugins/utils/index.js CHANGED
@@ -10,7 +10,7 @@ exports.findSearchIndex = findSearchIndex;
10
10
  exports.getSelectedText = getSelectedText;
11
11
  exports.removeMatchesFromSet = exports.removeDecorationsFromSet = exports.prevIndex = exports.nextIndex = exports.isMatchAffectedByStep = exports.getSelectionForMatch = void 0;
12
12
  var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
13
- var _classnames2 = _interopRequireDefault(require("classnames"));
13
+ var _classnames4 = _interopRequireDefault(require("classnames"));
14
14
  var _utils = require("@atlaskit/editor-common/utils");
15
15
  var _state = require("@atlaskit/editor-prosemirror/state");
16
16
  var _view = require("@atlaskit/editor-prosemirror/view");
@@ -31,34 +31,52 @@ var createDecorations = exports.createDecorations = function createDecorations(s
31
31
  return matches.map(function (_ref, i) {
32
32
  var start = _ref.start,
33
33
  end = _ref.end,
34
+ canReplace = _ref.canReplace,
34
35
  nodeType = _ref.nodeType;
35
- return createDecoration(start, end, i === selectedIndex, nodeType);
36
+ return createDecoration({
37
+ start: start,
38
+ end: end,
39
+ canReplace: canReplace,
40
+ nodeType: nodeType
41
+ }, i === selectedIndex);
36
42
  });
37
43
  };
38
- var isBlock = function isBlock(nodeType) {
39
- return nodeType === 'blockCard' || nodeType === 'embedCard';
44
+ var isElement = function isElement(nodeType) {
45
+ return ['blockCard', 'embedCard', 'inlineCard', 'status', 'mention', 'date'].includes(nodeType || '');
40
46
  };
41
- var createDecoration = exports.createDecoration = function createDecoration(start, end, isSelected, nodeType) {
47
+ var isExpandTitle = function isExpandTitle(match) {
48
+ return ['expand', 'nestedExpand'].includes(match.nodeType || '') && !match.canReplace;
49
+ };
50
+ var createDecoration = exports.createDecoration = function createDecoration(match, isSelected) {
51
+ var start = match.start,
52
+ end = match.end,
53
+ nodeType = match.nodeType;
42
54
  if ((0, _expValEquals.expValEquals)('platform_editor_find_and_replace_improvements', 'isEnabled', true)) {
43
55
  var _getGlobalTheme = (0, _tokens.getGlobalTheme)(),
44
56
  colorMode = _getGlobalTheme.colorMode;
45
- var className = (0, _classnames2.default)(_styles.searchMatchClass, (0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)({}, _styles.selectedSearchMatchClass, isSelected), _styles.blockSearchMatchClass, isBlock(nodeType)), _styles.darkModeSearchMatchClass, colorMode === 'dark'));
46
- if (isBlock(nodeType)) {
57
+ if (isElement(nodeType)) {
58
+ var className = (0, _classnames4.default)(_styles.blockSearchMatchClass, (0, _defineProperty2.default)((0, _defineProperty2.default)({}, _styles.selectedBlockSearchMatchClass, isSelected), _styles.darkModeSearchMatchClass, colorMode === 'dark'));
47
59
  return _view.Decoration.node(start, end, {
48
60
  class: className
49
61
  });
62
+ } else if (isExpandTitle(match)) {
63
+ var _className = (0, _classnames4.default)(_styles.searchMatchExpandTitleClass, (0, _defineProperty2.default)((0, _defineProperty2.default)({}, _styles.selectedSearchMatchClass, isSelected), _styles.darkModeSearchMatchClass, colorMode === 'dark'));
64
+ return _view.Decoration.node(start, end, {
65
+ class: _className
66
+ });
50
67
  } else {
68
+ var _className2 = (0, _classnames4.default)(_styles.searchMatchTextClass, (0, _defineProperty2.default)((0, _defineProperty2.default)({}, _styles.selectedSearchMatchClass, isSelected), _styles.darkModeSearchMatchClass, colorMode === 'dark'));
51
69
  return _view.Decoration.inline(start, end, {
52
- class: className
70
+ class: _className2
53
71
  });
54
72
  }
55
73
  } else {
56
- var _className = _styles.searchMatchClass;
74
+ var _className3 = _styles.searchMatchClass;
57
75
  if (isSelected) {
58
- _className += " ".concat(_styles.selectedSearchMatchClass);
76
+ _className3 += " ".concat(_styles.selectedSearchMatchClass);
59
77
  }
60
78
  return _view.Decoration.inline(start, end, {
61
- class: _className
79
+ class: _className3
62
80
  });
63
81
  }
64
82
  };
@@ -98,45 +116,23 @@ function findMatches(_ref2) {
98
116
  index = text.indexOf(searchText, end);
99
117
  }
100
118
  };
101
- var collectStatusMatch = function collectStatusMatch(textGrouping, nodeSize) {
119
+ var collectNodeMatch = function collectNodeMatch(textGrouping, node) {
102
120
  if (!textGrouping) {
103
121
  return;
104
122
  }
105
123
  var pos = textGrouping.pos;
106
124
  var text = textGrouping.text;
107
- if (shouldMatchCase) {
125
+ if (node.type.name === 'status' && shouldMatchCase) {
108
126
  text = text.toUpperCase();
109
- } else {
127
+ } else if (!shouldMatchCase) {
110
128
  text = text.toLowerCase();
111
129
  searchText = searchText.toLowerCase();
112
130
  }
113
131
  var index = text.indexOf(searchText);
114
132
  if (index !== -1) {
115
- var start = pos;
116
- matches.push({
117
- start: start,
118
- end: start + nodeSize,
119
- canReplace: false,
120
- nodeType: 'status'
121
- });
122
- }
123
- };
124
- var collectNodeMatch = function collectNodeMatch(textGrouping, node) {
125
- if (!textGrouping) {
126
- return;
127
- }
128
- var text = textGrouping.text;
129
- var pos = textGrouping.pos;
130
- if (!shouldMatchCase) {
131
- searchText = searchText.toLowerCase();
132
- text = text.toLowerCase();
133
- }
134
- var index = text.indexOf(searchText);
135
- if (index !== -1) {
136
- var start = pos;
137
133
  matches.push({
138
- start: start,
139
- end: start + node.nodeSize,
134
+ start: pos,
135
+ end: pos + node.nodeSize,
140
136
  canReplace: false,
141
137
  nodeType: node.type.name
142
138
  });
@@ -186,10 +182,10 @@ function findMatches(_ref2) {
186
182
  if ((0, _expValEquals.expValEquals)('platform_editor_find_and_replace_improvements', 'isEnabled', true)) {
187
183
  switch (node.type.name) {
188
184
  case 'status':
189
- collectStatusMatch({
185
+ collectNodeMatch({
190
186
  text: node.attrs.text,
191
187
  pos: pos
192
- }, node.nodeSize);
188
+ }, node);
193
189
  break;
194
190
  case 'date':
195
191
  collectNodeMatch({
@@ -197,6 +193,13 @@ function findMatches(_ref2) {
197
193
  pos: pos
198
194
  }, node);
199
195
  break;
196
+ case 'expand':
197
+ case 'nestedExpand':
198
+ collectNodeMatch({
199
+ text: node.attrs.title,
200
+ pos: pos
201
+ }, node);
202
+ break;
200
203
  case 'mention':
201
204
  var text;
202
205
  if (node.attrs.text) {
@@ -273,6 +276,10 @@ var prevIndex = exports.prevIndex = function prevIndex(currentIndex, total) {
273
276
  var getSelectionForMatch = exports.getSelectionForMatch = function getSelectionForMatch(selection, doc, index, matches) {
274
277
  var offset = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : 0;
275
278
  if (matches[index]) {
279
+ if (isExpandTitle(matches[index])) {
280
+ // create a text selection at the first position inside the expand body
281
+ return _state.TextSelection.create(doc, matches[index].start + offset - 2);
282
+ }
276
283
  return _state.TextSelection.create(doc, matches[index].start + offset);
277
284
  }
278
285
  return selection;
package/dist/cjs/ui/styles.js CHANGED
@@ -4,21 +4,28 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
4
4
  Object.defineProperty(exports, "__esModule", {
5
5
  value: true
6
6
  });
7
- exports.selectedSearchMatchClass = exports.searchMatchClass = exports.findReplaceStylesNew = exports.findReplaceStyles = exports.darkModeSearchMatchClass = exports.blockSearchMatchClass = void 0;
7
+ exports.selectedSearchMatchClass = exports.selectedBlockSearchMatchClass = exports.searchMatchTextClass = exports.searchMatchExpandTitleClass = exports.searchMatchClass = exports.findReplaceStylesNew = exports.findReplaceStyles = exports.darkModeSearchMatchClass = exports.blockSearchMatchClass = void 0;
8
8
  var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
9
9
  var _react = require("@emotion/react");
10
10
  var _colors = require("@atlaskit/theme/colors");
11
+ var _styles = require("@atlaskit/editor-common/styles");
12
+ var _css2;
11
13
  /* eslint-disable @atlaskit/editor/no-re-export */
12
14
  // Entry file in package.json
13
-
14
15
  /* eslint-disable @atlaskit/design-system/ensure-design-token-usage/preview */
15
16
  /* eslint-disable @atlaskit/design-system/ensure-design-token-usage */
16
17
  /* eslint-disable */
17
-
18
18
  var searchMatchClass = exports.searchMatchClass = 'search-match';
19
+ var searchMatchTextClass = exports.searchMatchTextClass = 'search-match-text';
19
20
  var selectedSearchMatchClass = exports.selectedSearchMatchClass = 'selected-search-match';
20
21
  var blockSearchMatchClass = exports.blockSearchMatchClass = 'search-match-block';
22
+ var selectedBlockSearchMatchClass = exports.selectedBlockSearchMatchClass = 'search-match-block-selected';
21
23
  var darkModeSearchMatchClass = exports.darkModeSearchMatchClass = 'search-match-dark';
24
+ var searchMatchExpandTitleClass = exports.searchMatchExpandTitleClass = 'search-match-expand-title';
25
+ var inlineCardSelector = '.loader-wrapper>a';
26
+ var statusSelector = '.lozenge-wrapper';
27
+ var mentionSelector = '.editor-mention-primitive';
28
+ var dateSelector = '.date-lozenger-container';
22
29
  var findReplaceStyles = exports.findReplaceStyles = (0, _react.css)((0, _defineProperty2.default)((0, _defineProperty2.default)({}, ".".concat(searchMatchClass), {
23
30
  borderRadius: '3px',
24
31
  backgroundColor: "var(--ds-background-accent-teal-subtlest, #E7F9FF)",
@@ -26,50 +33,96 @@ var findReplaceStyles = exports.findReplaceStyles = (0, _react.css)((0, _defineP
26
33
  }), ".".concat(selectedSearchMatchClass), {
27
34
  backgroundColor: "var(--ds-background-accent-teal-subtle, #6CC3E0)"
28
35
  }));
29
- var findReplaceStylesNew = exports.findReplaceStylesNew = (0, _react.css)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)({}, ".".concat(searchMatchClass), {
30
- borderRadius: '3px',
31
- backgroundColor: "var(--ds-background-accent-teal-subtlest, #E7F9FF)",
32
- boxShadow: "var(--ds-shadow-raised, 0 1px 1px 0 rgba(9, 30, 66, 0.25), 0 0 1px 0 rgba(9, 30, 66, 0.31))".concat(", inset 0 0 0 1px ", "var(--ds-border-input, #8590A2)")
33
- }), ".".concat(selectedSearchMatchClass), {
34
- backgroundColor: "var(--ds-background-accent-teal-subtle, #6CC3E0)"
35
- }), ".".concat(blockSearchMatchClass), {
36
+ var findReplaceStylesNew = exports.findReplaceStylesNew = (0, _react.css)((_css2 = {}, (0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)(_css2, ".".concat(searchMatchTextClass), {
37
+ borderRadius: "var(--ds-space-050, 4px)",
38
+ padding: "var(--ds-space-050, 4px)".concat(" 0"),
39
+ border: "1px solid ".concat("var(--ds-background-accent-yellow-subtler-pressed, #E2B203)"),
40
+ backgroundColor: "var(--ds-background-accent-yellow-subtler, #F8E6A0)",
41
+ color: "var(--ds-text, #172B4D)"
42
+ }), ".".concat(searchMatchTextClass, ".").concat(selectedSearchMatchClass), {
43
+ backgroundColor: "var(--ds-background-accent-yellow-subtlest-pressed, #F5CD47)"
44
+ }), ".".concat(searchMatchTextClass, ".").concat(darkModeSearchMatchClass), {
45
+ border: "1px solid ".concat("var(--ds-background-accent-yellow-bolder, #946F00)"),
46
+ backgroundColor: "var(--ds-background-accent-yellow-bolder-pressed, #533F04)",
47
+ color: "var(--ds-text-inverse, #FFFFFF)"
48
+ }), ".".concat(searchMatchTextClass, ".").concat(selectedSearchMatchClass, ".").concat(darkModeSearchMatchClass), {
49
+ backgroundColor: "var(--ds-background-accent-yellow-bolder-hovered, #7F5F01)"
50
+ }), ".".concat(blockSearchMatchClass), (0, _defineProperty2.default)({
36
51
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
37
52
  '[data-smart-link-container="true"], .loader-wrapper>div::after': {
38
53
  boxShadow: "\n\t\t\tinset 0 0 0 1px ".concat("var(--ds-background-accent-yellow-subtler-pressed, #E2B203)", ",\n\t\t\tinset 0 0 0 5px ", "var(--ds-background-accent-yellow-subtler, #F8E6A0)", "\n\t\t\t")
39
54
  }
40
- }), ".".concat(selectedSearchMatchClass, ".").concat(blockSearchMatchClass), {
55
+ }, "".concat(inlineCardSelector, ", ").concat(statusSelector, ", ").concat(mentionSelector, ", ").concat(dateSelector), {
56
+ boxShadow: "0px 0px 0px 4px ".concat("var(--ds-background-accent-yellow-subtler, #F8E6A0)", ", 0px 0px 0px 5px ", "var(--ds-background-accent-yellow-subtler-pressed, #E2B203)"),
57
+ borderRadius: '3px'
58
+ })), ".".concat(blockSearchMatchClass, ".").concat(selectedBlockSearchMatchClass), (0, _defineProperty2.default)({
41
59
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
42
60
  '[data-smart-link-container="true"], .loader-wrapper>div::after': {
43
61
  boxShadow: "\n\t\t\tinset 0 0 0 1px ".concat("var(--ds-background-accent-yellow-subtler-pressed, #E2B203)", ",\n\t\t\tinset 0 0 0 4px ", "var(--ds-background-accent-yellow-subtlest-pressed, #F5CD47)", "\n\t\t\t")
44
62
  }
45
- }), ".".concat(blockSearchMatchClass, ".ak-editor-selected-node"), {
63
+ }, "".concat(inlineCardSelector, ", ").concat(statusSelector, ", ").concat(mentionSelector, ", ").concat(dateSelector), {
64
+ boxShadow: "0px 0px 0px 4px ".concat("var(--ds-background-accent-yellow-subtlest-pressed, #F5CD47)", ", 0px 0px 0px 5px ", "var(--ds-background-accent-yellow-subtler-pressed, #E2B203)"),
65
+ borderRadius: '3px'
66
+ })), ".".concat(blockSearchMatchClass, ".ak-editor-selected-node"), (0, _defineProperty2.default)({
46
67
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
47
68
  '.loader-wrapper>div::after': {
48
69
  boxShadow: "\n\t\t\tinset 0 0 0 1px ".concat("var(--ds-background-accent-yellow-subtler-pressed, #E2B203)", ",\n\t\t\tinset 0 0 0 5px ", "var(--ds-background-accent-yellow-subtler, #F8E6A0)", ",\n\t\t\t0 0 0 1px ", "var(--ds-border-selected, #0C66E4)", "\n\t\t\t")
49
70
  }
50
- }), ".".concat(selectedSearchMatchClass, ".").concat(blockSearchMatchClass, ".ak-editor-selected-node"), {
71
+ }, "".concat(inlineCardSelector, ", ").concat(statusSelector), {
72
+ // TODO: will clean up !important later
73
+ boxShadow: "0 0 0 1px ".concat("var(--ds-border-selected, #0C66E4)", ", 0px 0px 0px 4px ", "var(--ds-background-accent-yellow-subtler, #F8E6A0)", ", 0px 0px 0px 5px ", "var(--ds-background-accent-yellow-subtler-pressed, #E2B203)", " !important")
74
+ })), ".".concat(blockSearchMatchClass, ".").concat(selectedBlockSearchMatchClass, ".ak-editor-selected-node"), (0, _defineProperty2.default)({
51
75
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
52
76
  '[data-smart-link-container="true"], .loader-wrapper>div::after': {
53
77
  boxShadow: "\n\t\t\tinset 0 0 0 1px ".concat("var(--ds-background-accent-yellow-subtler-pressed, #E2B203)", ",\n\t\t\tinset 0 0 0 4px ", "var(--ds-background-accent-yellow-subtlest-pressed, #F5CD47)", ",\n\t\t\t0 0 0 1px ", "var(--ds-border-selected, #0C66E4)", "\n\t\t\t")
54
78
  }
55
- }), ".".concat(blockSearchMatchClass, ".").concat(darkModeSearchMatchClass), {
79
+ }, "".concat(inlineCardSelector, ", ").concat(statusSelector), {
80
+ // TODO: will clean up !important later
81
+ boxShadow: "0 0 0 1px ".concat("var(--ds-border-selected, #0C66E4)", ", 0px 0px 0px 4px ", "var(--ds-background-accent-yellow-subtlest-pressed, #F5CD47)", ", 0px 0px 0px 5px ", "var(--ds-background-accent-yellow-subtler-pressed, #E2B203)", " !important")
82
+ })), ".".concat(blockSearchMatchClass, ".").concat(darkModeSearchMatchClass), (0, _defineProperty2.default)({
56
83
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
57
84
  '[data-smart-link-container="true"], .loader-wrapper>div::after': {
58
85
  boxShadow: "\n\t\t\tinset 0 0 0 1px ".concat("var(--ds-background-accent-yellow-bolder, #946F00)", ",\n\t\t\tinset 0 0 0 5px ", "var(--ds-background-accent-yellow-bolder-pressed, #533F04)", "\n\t\t\t")
59
86
  }
60
- }), ".".concat(selectedSearchMatchClass, ".").concat(blockSearchMatchClass, ".").concat(darkModeSearchMatchClass), {
87
+ }, "".concat(inlineCardSelector, ", ").concat(statusSelector, ", ").concat(mentionSelector, ", ").concat(dateSelector), {
88
+ boxShadow: "0px 0px 0px 4px ".concat("var(--ds-background-accent-yellow-bolder-pressed, #533F04)", ", 0px 0px 0px 5px ", "var(--ds-background-accent-yellow-bolder, #946F00)"),
89
+ borderRadius: '3px'
90
+ })), ".".concat(blockSearchMatchClass, ".").concat(selectedBlockSearchMatchClass, ".").concat(darkModeSearchMatchClass), (0, _defineProperty2.default)({
61
91
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
62
92
  '[data-smart-link-container="true"], .loader-wrapper>div::after': {
63
93
  boxShadow: "\n\t\t\tinset 0 0 0 1px ".concat("var(--ds-background-accent-yellow-bolder, #946F00)", ",\n\t\t\tinset 0 0 0 4px ", "var(--ds-background-accent-yellow-bolder-hovered, #7F5F01)", "\n\t\t\t")
64
94
  }
65
- }), ".".concat(blockSearchMatchClass, ".").concat(darkModeSearchMatchClass, ".ak-editor-selected-node"), {
95
+ }, "".concat(inlineCardSelector, ", ").concat(statusSelector, ", ").concat(mentionSelector, ", ").concat(dateSelector), {
96
+ boxShadow: "0px 0px 0px 4px ".concat("var(--ds-background-accent-yellow-bolder-hovered, #7F5F01)", ", 0px 0px 0px 5px ", "var(--ds-background-accent-yellow-bolder, #946F00)"),
97
+ borderRadius: '3px'
98
+ })), (0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)(_css2, ".".concat(blockSearchMatchClass, ".").concat(darkModeSearchMatchClass, ".ak-editor-selected-node"), (0, _defineProperty2.default)({
66
99
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
67
100
  '.loader-wrapper>div::after': {
68
101
  boxShadow: "\n\t\t\tinset 0 0 0 1px ".concat("var(--ds-background-accent-yellow-bolder, #946F00)", ",\n\t\t\tinset 0 0 0 5px ", "var(--ds-background-accent-yellow-bolder-pressed, #533F04)", ",\n\t\t\t0 0 0 1px ", "var(--ds-border-selected, #0C66E4)", "\n\t\t\t")
69
102
  }
70
- }), ".".concat(selectedSearchMatchClass, ".").concat(blockSearchMatchClass, ".").concat(darkModeSearchMatchClass, ".ak-editor-selected-node"), {
103
+ }, "".concat(inlineCardSelector, ", ").concat(statusSelector), {
104
+ boxShadow: "0 0 0 1px ".concat("var(--ds-border-selected, #0C66E4)", ", 0px 0px 0px 4px ", "var(--ds-background-accent-yellow-bolder-pressed, #533F04)", ", 0px 0px 0px 5px ", "var(--ds-background-accent-yellow-bolder, #946F00)", " !important")
105
+ })), ".".concat(blockSearchMatchClass, ".").concat(selectedBlockSearchMatchClass, ".").concat(darkModeSearchMatchClass, ".ak-editor-selected-node"), (0, _defineProperty2.default)({
71
106
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
72
107
  '[data-smart-link-container="true"], .loader-wrapper>div::after': {
73
108
  boxShadow: "\n\t\t\tinset 0 0 0 1px ".concat("var(--ds-background-accent-yellow-bolder, #946F00)", ",\n\t\t\tinset 0 0 0 4px ", "var(--ds-background-accent-yellow-bolder-hovered, #7F5F01)", ",\n\t\t\t0 0 0 1px ", "var(--ds-border-selected, #0C66E4)", "\n\t\t\t")
74
109
  }
75
- }));
110
+ }, "".concat(inlineCardSelector, ", ").concat(statusSelector), {
111
+ boxShadow: "0 0 0 1px ".concat("var(--ds-border-selected, #0C66E4)", ", 0px 0px 0px 4px ", "var(--ds-background-accent-yellow-bolder-hovered, #7F5F01)", ", 0px 0px 0px 5px ", "var(--ds-background-accent-yellow-bolder, #946F00)", " !important")
112
+ })), ".".concat(searchMatchExpandTitleClass, " > .").concat(_styles.expandClassNames.titleContainer, " > .").concat(_styles.expandClassNames.inputContainer), (0, _defineProperty2.default)({
113
+ borderRadius: "var(--ds-space-050, 4px)",
114
+ padding: "var(--ds-space-050, 4px)".concat(" 0"),
115
+ border: "1px solid ".concat("var(--ds-background-accent-yellow-subtler-pressed, #E2B203)"),
116
+ backgroundColor: "var(--ds-background-accent-yellow-subtler, #F8E6A0)"
117
+ }, ".".concat(_styles.expandClassNames.titleInput), {
118
+ color: "var(--ds-text, #172B4D)"
119
+ })), ".".concat(searchMatchExpandTitleClass, ".").concat(selectedSearchMatchClass, " > .").concat(_styles.expandClassNames.titleContainer, " > .").concat(_styles.expandClassNames.inputContainer), {
120
+ backgroundColor: "var(--ds-background-accent-yellow-subtlest-pressed, #F5CD47)"
121
+ }), ".".concat(searchMatchExpandTitleClass, ".").concat(darkModeSearchMatchClass, " > .").concat(_styles.expandClassNames.titleContainer, " > .").concat(_styles.expandClassNames.inputContainer), (0, _defineProperty2.default)({
122
+ border: "1px solid ".concat("var(--ds-background-accent-yellow-bolder, #946F00)"),
123
+ backgroundColor: "var(--ds-background-accent-yellow-bolder-pressed, #533F04)"
124
+ }, ".".concat(_styles.expandClassNames.titleInput), {
125
+ color: "var(--ds-text-inverse, #FFFFFF)"
126
+ })), ".".concat(searchMatchExpandTitleClass, ".").concat(selectedSearchMatchClass, ".").concat(darkModeSearchMatchClass, " > .").concat(_styles.expandClassNames.titleContainer, " > .").concat(_styles.expandClassNames.inputContainer), {
127
+ backgroundColor: "var(--ds-background-accent-yellow-bolder-hovered, #7F5F01)"
128
+ })));
package/dist/es2019/pm-plugins/commands.js CHANGED
@@ -264,10 +264,10 @@ const updateSelectedHighlight = (state, nextSelectedIndex) => {
264
264
  decorationSet = removeDecorationsFromSet(decorationSet, decorationsToRemove, state.doc);
265
265
  }
266
266
  if (currentSelectedMatch) {
267
- decorationSet = decorationSet.add(state.doc, [createDecoration(currentSelectedMatch.start, currentSelectedMatch.end, false, expValEquals('platform_editor_find_and_replace_improvements', 'isEnabled', true) ? currentSelectedMatch.nodeType : undefined)]);
267
+ decorationSet = decorationSet.add(state.doc, [createDecoration(currentSelectedMatch)]);
268
268
  }
269
269
  if (nextSelectedMatch) {
270
- decorationSet = decorationSet.add(state.doc, [createDecoration(nextSelectedMatch.start, nextSelectedMatch.end, true, expValEquals('platform_editor_find_and_replace_improvements', 'isEnabled', true) ? nextSelectedMatch.nodeType : undefined)]);
270
+ decorationSet = decorationSet.add(state.doc, [createDecoration(nextSelectedMatch, true)]);
271
271
  }
272
272
  return decorationSet;
273
273
  };
package/dist/es2019/pm-plugins/plugin-factory.js CHANGED
@@ -40,7 +40,8 @@ const handleDocChanged = (tr, pluginState) => {
40
40
  const mappedMatches = matches.map(match => ({
41
41
  start: tr.mapping.map(match.start),
42
42
  end: tr.mapping.map(match.end),
43
- canReplace: match.canReplace
43
+ canReplace: match.canReplace,
44
+ nodeType: match.nodeType
44
45
  }));
45
46
  let matchesToAdd = [];
46
47
  let matchesToDelete = [];
package/dist/es2019/pm-plugins/utils/index.js CHANGED
@@ -6,7 +6,7 @@ import { isResolvingMentionProvider } from '@atlaskit/mention/resource';
6
6
  import { isPromise, MentionNameStatus } from '@atlaskit/mention/types';
7
7
  import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
8
8
  import { getGlobalTheme } from '@atlaskit/tokens';
9
- import { searchMatchClass, selectedSearchMatchClass, blockSearchMatchClass, darkModeSearchMatchClass } from '../../ui/styles';
9
+ import { searchMatchClass, selectedSearchMatchClass, blockSearchMatchClass, darkModeSearchMatchClass, selectedBlockSearchMatchClass, searchMatchExpandTitleClass, searchMatchTextClass } from '../../ui/styles';
10
10
  export function getSelectedText(selection) {
11
11
  let text = '';
12
12
  const selectedContent = selection.content().content;
@@ -18,24 +18,47 @@ export function getSelectedText(selection) {
18
18
  export const createDecorations = (selectedIndex, matches) => matches.map(({
19
19
  start,
20
20
  end,
21
+ canReplace,
21
22
  nodeType
22
- }, i) => createDecoration(start, end, i === selectedIndex, nodeType));
23
- const isBlock = nodeType => nodeType === 'blockCard' || nodeType === 'embedCard';
24
- export const createDecoration = (start, end, isSelected, nodeType) => {
23
+ }, i) => createDecoration({
24
+ start,
25
+ end,
26
+ canReplace,
27
+ nodeType
28
+ }, i === selectedIndex));
29
+ const isElement = nodeType => ['blockCard', 'embedCard', 'inlineCard', 'status', 'mention', 'date'].includes(nodeType || '');
30
+ const isExpandTitle = match => ['expand', 'nestedExpand'].includes(match.nodeType || '') && !match.canReplace;
31
+ export const createDecoration = (match, isSelected) => {
32
+ const {
33
+ start,
34
+ end,
35
+ nodeType
36
+ } = match;
25
37
  if (expValEquals('platform_editor_find_and_replace_improvements', 'isEnabled', true)) {
26
38
  const {
27
39
  colorMode
28
40
  } = getGlobalTheme();
29
- const className = classnames(searchMatchClass, {
30
- [selectedSearchMatchClass]: isSelected,
31
- [blockSearchMatchClass]: isBlock(nodeType),
32
- [darkModeSearchMatchClass]: colorMode === 'dark'
33
- });
34
- if (isBlock(nodeType)) {
41
+ if (isElement(nodeType)) {
42
+ const className = classnames(blockSearchMatchClass, {
43
+ [selectedBlockSearchMatchClass]: isSelected,
44
+ [darkModeSearchMatchClass]: colorMode === 'dark'
45
+ });
46
+ return Decoration.node(start, end, {
47
+ class: className
48
+ });
49
+ } else if (isExpandTitle(match)) {
50
+ const className = classnames(searchMatchExpandTitleClass, {
51
+ [selectedSearchMatchClass]: isSelected,
52
+ [darkModeSearchMatchClass]: colorMode === 'dark'
53
+ });
35
54
  return Decoration.node(start, end, {
36
55
  class: className
37
56
  });
38
57
  } else {
58
+ const className = classnames(searchMatchTextClass, {
59
+ [selectedSearchMatchClass]: isSelected,
60
+ [darkModeSearchMatchClass]: colorMode === 'dark'
61
+ });
39
62
  return Decoration.inline(start, end, {
40
63
  class: className
41
64
  });
@@ -90,7 +113,7 @@ export function findMatches({
90
113
  index = text.indexOf(searchText, end);
91
114
  }
92
115
  };
93
- const collectStatusMatch = (textGrouping, nodeSize) => {
116
+ const collectNodeMatch = (textGrouping, node) => {
94
117
  if (!textGrouping) {
95
118
  return;
96
119
  }
@@ -100,43 +123,17 @@ export function findMatches({
100
123
  let {
101
124
  text
102
125
  } = textGrouping;
103
- if (shouldMatchCase) {
126
+ if (node.type.name === 'status' && shouldMatchCase) {
104
127
  text = text.toUpperCase();
105
- } else {
128
+ } else if (!shouldMatchCase) {
106
129
  text = text.toLowerCase();
107
130
  searchText = searchText.toLowerCase();
108
131
  }
109
132
  const index = text.indexOf(searchText);
110
133
  if (index !== -1) {
111
- const start = pos;
112
134
  matches.push({
113
- start,
114
- end: start + nodeSize,
115
- canReplace: false,
116
- nodeType: 'status'
117
- });
118
- }
119
- };
120
- const collectNodeMatch = (textGrouping, node) => {
121
- if (!textGrouping) {
122
- return;
123
- }
124
- let {
125
- text
126
- } = textGrouping;
127
- const {
128
- pos
129
- } = textGrouping;
130
- if (!shouldMatchCase) {
131
- searchText = searchText.toLowerCase();
132
- text = text.toLowerCase();
133
- }
134
- const index = text.indexOf(searchText);
135
- if (index !== -1) {
136
- const start = pos;
137
- matches.push({
138
- start,
139
- end: start + node.nodeSize,
135
+ start: pos,
136
+ end: pos + node.nodeSize,
140
137
  canReplace: false,
141
138
  nodeType: node.type.name
142
139
  });
@@ -184,10 +181,10 @@ export function findMatches({
184
181
  if (expValEquals('platform_editor_find_and_replace_improvements', 'isEnabled', true)) {
185
182
  switch (node.type.name) {
186
183
  case 'status':
187
- collectStatusMatch({
184
+ collectNodeMatch({
188
185
  text: node.attrs.text,
189
186
  pos
190
- }, node.nodeSize);
187
+ }, node);
191
188
  break;
192
189
  case 'date':
193
190
  collectNodeMatch({
@@ -195,6 +192,13 @@ export function findMatches({
195
192
  pos
196
193
  }, node);
197
194
  break;
195
+ case 'expand':
196
+ case 'nestedExpand':
197
+ collectNodeMatch({
198
+ text: node.attrs.title,
199
+ pos
200
+ }, node);
201
+ break;
198
202
  case 'mention':
199
203
  let text;
200
204
  if (node.attrs.text) {
@@ -261,6 +265,10 @@ export const nextIndex = (currentIndex, total) => (currentIndex + 1) % total;
261
265
  export const prevIndex = (currentIndex, total) => (currentIndex - 1 + total) % total;
262
266
  export const getSelectionForMatch = (selection, doc, index, matches, offset = 0) => {
263
267
  if (matches[index]) {
268
+ if (isExpandTitle(matches[index])) {
269
+ // create a text selection at the first position inside the expand body
270
+ return TextSelection.create(doc, matches[index].start + offset - 2);
271
+ }
264
272
  return TextSelection.create(doc, matches[index].start + offset);
265
273
  }
266
274
  return selection;
package/dist/es2019/ui/styles.js CHANGED
@@ -7,10 +7,18 @@
7
7
 
8
8
  import { css } from '@emotion/react';
9
9
  import { N40A, N50A, N60A } from '@atlaskit/theme/colors';
10
+ import { expandClassNames } from '@atlaskit/editor-common/styles';
10
11
  export const searchMatchClass = 'search-match';
12
+ export const searchMatchTextClass = 'search-match-text';
11
13
  export const selectedSearchMatchClass = 'selected-search-match';
12
14
  export const blockSearchMatchClass = 'search-match-block';
15
+ export const selectedBlockSearchMatchClass = 'search-match-block-selected';
13
16
  export const darkModeSearchMatchClass = 'search-match-dark';
17
+ export const searchMatchExpandTitleClass = 'search-match-expand-title';
18
+ const inlineCardSelector = '.loader-wrapper>a';
19
+ const statusSelector = '.lozenge-wrapper';
20
+ const mentionSelector = '.editor-mention-primitive';
21
+ const dateSelector = '.date-lozenger-container';
14
22
  export const findReplaceStyles = css({
15
23
  [`.${searchMatchClass}`]: {
16
24
  borderRadius: '3px',
@@ -23,13 +31,32 @@ export const findReplaceStyles = css({
23
31
  });
24
32
  export const findReplaceStylesNew = css({
25
33
  /** Text match styles */
26
- [`.${searchMatchClass}`]: {
27
- borderRadius: '3px',
28
- backgroundColor: "var(--ds-background-accent-teal-subtlest, #E7F9FF)",
29
- boxShadow: `${"var(--ds-shadow-raised, 0 1px 1px 0 rgba(9, 30, 66, 0.25), 0 0 1px 0 rgba(9, 30, 66, 0.31))"}, inset 0 0 0 1px ${"var(--ds-border-input, #8590A2)"}`
34
+
35
+ /** Light mode */
36
+
37
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
38
+ [`.${searchMatchTextClass}`]: {
39
+ borderRadius: "var(--ds-space-050, 4px)",
40
+ padding: `${"var(--ds-space-050, 4px)"} 0`,
41
+ border: `1px solid ${"var(--ds-background-accent-yellow-subtler-pressed, #E2B203)"}`,
42
+ backgroundColor: "var(--ds-background-accent-yellow-subtler, #F8E6A0)",
43
+ color: "var(--ds-text, #172B4D)"
30
44
  },
31
- [`.${selectedSearchMatchClass}`]: {
32
- backgroundColor: "var(--ds-background-accent-teal-subtle, #6CC3E0)"
45
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
46
+ [`.${searchMatchTextClass}.${selectedSearchMatchClass}`]: {
47
+ backgroundColor: "var(--ds-background-accent-yellow-subtlest-pressed, #F5CD47)"
48
+ },
49
+ /** Dark mode */
50
+
51
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
52
+ [`.${searchMatchTextClass}.${darkModeSearchMatchClass}`]: {
53
+ border: `1px solid ${"var(--ds-background-accent-yellow-bolder, #946F00)"}`,
54
+ backgroundColor: "var(--ds-background-accent-yellow-bolder-pressed, #533F04)",
55
+ color: "var(--ds-text-inverse, #FFFFFF)"
56
+ },
57
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
58
+ [`.${searchMatchTextClass}.${selectedSearchMatchClass}.${darkModeSearchMatchClass}`]: {
59
+ backgroundColor: "var(--ds-background-accent-yellow-bolder-hovered, #7F5F01)"
33
60
  },
34
61
  /** Block match styles */
35
62
 
@@ -43,15 +70,23 @@ export const findReplaceStylesNew = css({
43
70
  inset 0 0 0 1px ${"var(--ds-background-accent-yellow-subtler-pressed, #E2B203)"},
44
71
  inset 0 0 0 5px ${"var(--ds-background-accent-yellow-subtler, #F8E6A0)"}
45
72
  `
73
+ },
74
+ [`${inlineCardSelector}, ${statusSelector}, ${mentionSelector}, ${dateSelector}`]: {
75
+ boxShadow: `0px 0px 0px 4px ${"var(--ds-background-accent-yellow-subtler, #F8E6A0)"}, 0px 0px 0px 5px ${"var(--ds-background-accent-yellow-subtler-pressed, #E2B203)"}`,
76
+ borderRadius: '3px'
46
77
  }
47
78
  },
48
- [`.${selectedSearchMatchClass}.${blockSearchMatchClass}`]: {
79
+ [`.${blockSearchMatchClass}.${selectedBlockSearchMatchClass}`]: {
49
80
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
50
81
  '[data-smart-link-container="true"], .loader-wrapper>div::after': {
51
82
  boxShadow: `
52
83
  inset 0 0 0 1px ${"var(--ds-background-accent-yellow-subtler-pressed, #E2B203)"},
53
84
  inset 0 0 0 4px ${"var(--ds-background-accent-yellow-subtlest-pressed, #F5CD47)"}
54
85
  `
86
+ },
87
+ [`${inlineCardSelector}, ${statusSelector}, ${mentionSelector}, ${dateSelector}`]: {
88
+ boxShadow: `0px 0px 0px 4px ${"var(--ds-background-accent-yellow-subtlest-pressed, #F5CD47)"}, 0px 0px 0px 5px ${"var(--ds-background-accent-yellow-subtler-pressed, #E2B203)"}`,
89
+ borderRadius: '3px'
55
90
  }
56
91
  },
57
92
  /** With node selection */
@@ -63,9 +98,13 @@ export const findReplaceStylesNew = css({
63
98
  inset 0 0 0 5px ${"var(--ds-background-accent-yellow-subtler, #F8E6A0)"},
64
99
  0 0 0 1px ${"var(--ds-border-selected, #0C66E4)"}
65
100
  `
101
+ },
102
+ [`${inlineCardSelector}, ${statusSelector}`]: {
103
+ // TODO: will clean up !important later
104
+ boxShadow: `0 0 0 1px ${"var(--ds-border-selected, #0C66E4)"}, 0px 0px 0px 4px ${"var(--ds-background-accent-yellow-subtler, #F8E6A0)"}, 0px 0px 0px 5px ${"var(--ds-background-accent-yellow-subtler-pressed, #E2B203)"} !important`
66
105
  }
67
106
  },
68
- [`.${selectedSearchMatchClass}.${blockSearchMatchClass}.ak-editor-selected-node`]: {
107
+ [`.${blockSearchMatchClass}.${selectedBlockSearchMatchClass}.ak-editor-selected-node`]: {
69
108
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
70
109
  '[data-smart-link-container="true"], .loader-wrapper>div::after': {
71
110
  boxShadow: `
@@ -73,10 +112,13 @@ export const findReplaceStylesNew = css({
73
112
  inset 0 0 0 4px ${"var(--ds-background-accent-yellow-subtlest-pressed, #F5CD47)"},
74
113
  0 0 0 1px ${"var(--ds-border-selected, #0C66E4)"}
75
114
  `
115
+ },
116
+ [`${inlineCardSelector}, ${statusSelector}`]: {
117
+ // TODO: will clean up !important later
118
+ boxShadow: `0 0 0 1px ${"var(--ds-border-selected, #0C66E4)"}, 0px 0px 0px 4px ${"var(--ds-background-accent-yellow-subtlest-pressed, #F5CD47)"}, 0px 0px 0px 5px ${"var(--ds-background-accent-yellow-subtler-pressed, #E2B203)"} !important`
76
119
  }
77
120
  },
78
121
  /** Dark mode */
79
-
80
122
  /** Without node selection */
81
123
  [`.${blockSearchMatchClass}.${darkModeSearchMatchClass}`]: {
82
124
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
@@ -85,15 +127,23 @@ export const findReplaceStylesNew = css({
85
127
  inset 0 0 0 1px ${"var(--ds-background-accent-yellow-bolder, #946F00)"},
86
128
  inset 0 0 0 5px ${"var(--ds-background-accent-yellow-bolder-pressed, #533F04)"}
87
129
  `
130
+ },
131
+ [`${inlineCardSelector}, ${statusSelector}, ${mentionSelector}, ${dateSelector}`]: {
132
+ boxShadow: `0px 0px 0px 4px ${"var(--ds-background-accent-yellow-bolder-pressed, #533F04)"}, 0px 0px 0px 5px ${"var(--ds-background-accent-yellow-bolder, #946F00)"}`,
133
+ borderRadius: '3px'
88
134
  }
89
135
  },
90
- [`.${selectedSearchMatchClass}.${blockSearchMatchClass}.${darkModeSearchMatchClass}`]: {
136
+ [`.${blockSearchMatchClass}.${selectedBlockSearchMatchClass}.${darkModeSearchMatchClass}`]: {
91
137
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
92
138
  '[data-smart-link-container="true"], .loader-wrapper>div::after': {
93
139
  boxShadow: `
94
140
  inset 0 0 0 1px ${"var(--ds-background-accent-yellow-bolder, #946F00)"},
95
141
  inset 0 0 0 4px ${"var(--ds-background-accent-yellow-bolder-hovered, #7F5F01)"}
96
142
  `
143
+ },
144
+ [`${inlineCardSelector}, ${statusSelector}, ${mentionSelector}, ${dateSelector}`]: {
145
+ boxShadow: `0px 0px 0px 4px ${"var(--ds-background-accent-yellow-bolder-hovered, #7F5F01)"}, 0px 0px 0px 5px ${"var(--ds-background-accent-yellow-bolder, #946F00)"}`,
146
+ borderRadius: '3px'
97
147
  }
98
148
  },
99
149
  /** With node selection */
@@ -105,9 +155,12 @@ export const findReplaceStylesNew = css({
105
155
  inset 0 0 0 5px ${"var(--ds-background-accent-yellow-bolder-pressed, #533F04)"},
106
156
  0 0 0 1px ${"var(--ds-border-selected, #0C66E4)"}
107
157
  `
158
+ },
159
+ [`${inlineCardSelector}, ${statusSelector}`]: {
160
+ boxShadow: `0 0 0 1px ${"var(--ds-border-selected, #0C66E4)"}, 0px 0px 0px 4px ${"var(--ds-background-accent-yellow-bolder-pressed, #533F04)"}, 0px 0px 0px 5px ${"var(--ds-background-accent-yellow-bolder, #946F00)"} !important`
108
161
  }
109
162
  },
110
- [`.${selectedSearchMatchClass}.${blockSearchMatchClass}.${darkModeSearchMatchClass}.ak-editor-selected-node`]: {
163
+ [`.${blockSearchMatchClass}.${selectedBlockSearchMatchClass}.${darkModeSearchMatchClass}.ak-editor-selected-node`]: {
111
164
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
112
165
  '[data-smart-link-container="true"], .loader-wrapper>div::after': {
113
166
  boxShadow: `
@@ -115,6 +168,43 @@ export const findReplaceStylesNew = css({
115
168
  inset 0 0 0 4px ${"var(--ds-background-accent-yellow-bolder-hovered, #7F5F01)"},
116
169
  0 0 0 1px ${"var(--ds-border-selected, #0C66E4)"}
117
170
  `
171
+ },
172
+ [`${inlineCardSelector}, ${statusSelector}`]: {
173
+ boxShadow: `0 0 0 1px ${"var(--ds-border-selected, #0C66E4)"}, 0px 0px 0px 4px ${"var(--ds-background-accent-yellow-bolder-hovered, #7F5F01)"}, 0px 0px 0px 5px ${"var(--ds-background-accent-yellow-bolder, #946F00)"} !important`
118
174
  }
175
+ },
176
+ /** Expand title match styles */
177
+
178
+ /** Light mode */
179
+
180
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
181
+ [`.${searchMatchExpandTitleClass} > .${expandClassNames.titleContainer} > .${expandClassNames.inputContainer}`]: {
182
+ borderRadius: "var(--ds-space-050, 4px)",
183
+ padding: `${"var(--ds-space-050, 4px)"} 0`,
184
+ border: `1px solid ${"var(--ds-background-accent-yellow-subtler-pressed, #E2B203)"}`,
185
+ backgroundColor: "var(--ds-background-accent-yellow-subtler, #F8E6A0)",
186
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
187
+ [`.${expandClassNames.titleInput}`]: {
188
+ color: "var(--ds-text, #172B4D)"
189
+ }
190
+ },
191
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
192
+ [`.${searchMatchExpandTitleClass}.${selectedSearchMatchClass} > .${expandClassNames.titleContainer} > .${expandClassNames.inputContainer}`]: {
193
+ backgroundColor: "var(--ds-background-accent-yellow-subtlest-pressed, #F5CD47)"
194
+ },
195
+ /** Dark mode */
196
+
197
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
198
+ [`.${searchMatchExpandTitleClass}.${darkModeSearchMatchClass} > .${expandClassNames.titleContainer} > .${expandClassNames.inputContainer}`]: {
199
+ border: `1px solid ${"var(--ds-background-accent-yellow-bolder, #946F00)"}`,
200
+ backgroundColor: "var(--ds-background-accent-yellow-bolder-pressed, #533F04)",
201
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
202
+ [`.${expandClassNames.titleInput}`]: {
203
+ color: "var(--ds-text-inverse, #FFFFFF)"
204
+ }
205
+ },
206
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
207
+ [`.${searchMatchExpandTitleClass}.${selectedSearchMatchClass}.${darkModeSearchMatchClass} > .${expandClassNames.titleContainer} > .${expandClassNames.inputContainer}`]: {
208
+ backgroundColor: "var(--ds-background-accent-yellow-bolder-hovered, #7F5F01)"
119
209
  }
120
210
  });
package/dist/esm/pm-plugins/commands.js CHANGED
@@ -271,10 +271,10 @@ var updateSelectedHighlight = function updateSelectedHighlight(state, nextSelect
271
271
  decorationSet = removeDecorationsFromSet(decorationSet, decorationsToRemove, state.doc);
272
272
  }
273
273
  if (currentSelectedMatch) {
274
- decorationSet = decorationSet.add(state.doc, [createDecoration(currentSelectedMatch.start, currentSelectedMatch.end, false, expValEquals('platform_editor_find_and_replace_improvements', 'isEnabled', true) ? currentSelectedMatch.nodeType : undefined)]);
274
+ decorationSet = decorationSet.add(state.doc, [createDecoration(currentSelectedMatch)]);
275
275
  }
276
276
  if (nextSelectedMatch) {
277
- decorationSet = decorationSet.add(state.doc, [createDecoration(nextSelectedMatch.start, nextSelectedMatch.end, true, expValEquals('platform_editor_find_and_replace_improvements', 'isEnabled', true) ? nextSelectedMatch.nodeType : undefined)]);
277
+ decorationSet = decorationSet.add(state.doc, [createDecoration(nextSelectedMatch, true)]);
278
278
  }
279
279
  return decorationSet;
280
280
  };
package/dist/esm/pm-plugins/plugin-factory.js CHANGED
@@ -41,7 +41,8 @@ var handleDocChanged = function handleDocChanged(tr, pluginState) {
41
41
  return {
42
42
  start: tr.mapping.map(match.start),
43
43
  end: tr.mapping.map(match.end),
44
- canReplace: match.canReplace
44
+ canReplace: match.canReplace,
45
+ nodeType: match.nodeType
45
46
  };
46
47
  });
47
48
  var matchesToAdd = [];
package/dist/esm/pm-plugins/utils/index.js CHANGED
@@ -7,7 +7,7 @@ import { isResolvingMentionProvider } from '@atlaskit/mention/resource';
7
7
  import { isPromise, MentionNameStatus } from '@atlaskit/mention/types';
8
8
  import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
9
9
  import { getGlobalTheme } from '@atlaskit/tokens';
10
- import { searchMatchClass, selectedSearchMatchClass, blockSearchMatchClass, darkModeSearchMatchClass } from '../../ui/styles';
10
+ import { searchMatchClass, selectedSearchMatchClass, blockSearchMatchClass, darkModeSearchMatchClass, selectedBlockSearchMatchClass, searchMatchExpandTitleClass, searchMatchTextClass } from '../../ui/styles';
11
11
  export function getSelectedText(selection) {
12
12
  var text = '';
13
13
  var selectedContent = selection.content().content;
@@ -20,34 +20,52 @@ export var createDecorations = function createDecorations(selectedIndex, matches
20
20
  return matches.map(function (_ref, i) {
21
21
  var start = _ref.start,
22
22
  end = _ref.end,
23
+ canReplace = _ref.canReplace,
23
24
  nodeType = _ref.nodeType;
24
- return createDecoration(start, end, i === selectedIndex, nodeType);
25
+ return createDecoration({
26
+ start: start,
27
+ end: end,
28
+ canReplace: canReplace,
29
+ nodeType: nodeType
30
+ }, i === selectedIndex);
25
31
  });
26
32
  };
27
- var isBlock = function isBlock(nodeType) {
28
- return nodeType === 'blockCard' || nodeType === 'embedCard';
33
+ var isElement = function isElement(nodeType) {
34
+ return ['blockCard', 'embedCard', 'inlineCard', 'status', 'mention', 'date'].includes(nodeType || '');
29
35
  };
30
- export var createDecoration = function createDecoration(start, end, isSelected, nodeType) {
36
+ var isExpandTitle = function isExpandTitle(match) {
37
+ return ['expand', 'nestedExpand'].includes(match.nodeType || '') && !match.canReplace;
38
+ };
39
+ export var createDecoration = function createDecoration(match, isSelected) {
40
+ var start = match.start,
41
+ end = match.end,
42
+ nodeType = match.nodeType;
31
43
  if (expValEquals('platform_editor_find_and_replace_improvements', 'isEnabled', true)) {
32
44
  var _getGlobalTheme = getGlobalTheme(),
33
45
  colorMode = _getGlobalTheme.colorMode;
34
- var className = classnames(searchMatchClass, _defineProperty(_defineProperty(_defineProperty({}, selectedSearchMatchClass, isSelected), blockSearchMatchClass, isBlock(nodeType)), darkModeSearchMatchClass, colorMode === 'dark'));
35
- if (isBlock(nodeType)) {
46
+ if (isElement(nodeType)) {
47
+ var className = classnames(blockSearchMatchClass, _defineProperty(_defineProperty({}, selectedBlockSearchMatchClass, isSelected), darkModeSearchMatchClass, colorMode === 'dark'));
36
48
  return Decoration.node(start, end, {
37
49
  class: className
38
50
  });
51
+ } else if (isExpandTitle(match)) {
52
+ var _className = classnames(searchMatchExpandTitleClass, _defineProperty(_defineProperty({}, selectedSearchMatchClass, isSelected), darkModeSearchMatchClass, colorMode === 'dark'));
53
+ return Decoration.node(start, end, {
54
+ class: _className
55
+ });
39
56
  } else {
57
+ var _className2 = classnames(searchMatchTextClass, _defineProperty(_defineProperty({}, selectedSearchMatchClass, isSelected), darkModeSearchMatchClass, colorMode === 'dark'));
40
58
  return Decoration.inline(start, end, {
41
- class: className
59
+ class: _className2
42
60
  });
43
61
  }
44
62
  } else {
45
- var _className = searchMatchClass;
63
+ var _className3 = searchMatchClass;
46
64
  if (isSelected) {
47
- _className += " ".concat(selectedSearchMatchClass);
65
+ _className3 += " ".concat(selectedSearchMatchClass);
48
66
  }
49
67
  return Decoration.inline(start, end, {
50
- class: _className
68
+ class: _className3
51
69
  });
52
70
  }
53
71
  };
@@ -87,45 +105,23 @@ export function findMatches(_ref2) {
87
105
  index = text.indexOf(searchText, end);
88
106
  }
89
107
  };
90
- var collectStatusMatch = function collectStatusMatch(textGrouping, nodeSize) {
108
+ var collectNodeMatch = function collectNodeMatch(textGrouping, node) {
91
109
  if (!textGrouping) {
92
110
  return;
93
111
  }
94
112
  var pos = textGrouping.pos;
95
113
  var text = textGrouping.text;
96
- if (shouldMatchCase) {
114
+ if (node.type.name === 'status' && shouldMatchCase) {
97
115
  text = text.toUpperCase();
98
- } else {
116
+ } else if (!shouldMatchCase) {
99
117
  text = text.toLowerCase();
100
118
  searchText = searchText.toLowerCase();
101
119
  }
102
120
  var index = text.indexOf(searchText);
103
121
  if (index !== -1) {
104
- var start = pos;
105
- matches.push({
106
- start: start,
107
- end: start + nodeSize,
108
- canReplace: false,
109
- nodeType: 'status'
110
- });
111
- }
112
- };
113
- var collectNodeMatch = function collectNodeMatch(textGrouping, node) {
114
- if (!textGrouping) {
115
- return;
116
- }
117
- var text = textGrouping.text;
118
- var pos = textGrouping.pos;
119
- if (!shouldMatchCase) {
120
- searchText = searchText.toLowerCase();
121
- text = text.toLowerCase();
122
- }
123
- var index = text.indexOf(searchText);
124
- if (index !== -1) {
125
- var start = pos;
126
122
  matches.push({
127
- start: start,
128
- end: start + node.nodeSize,
123
+ start: pos,
124
+ end: pos + node.nodeSize,
129
125
  canReplace: false,
130
126
  nodeType: node.type.name
131
127
  });
@@ -175,10 +171,10 @@ export function findMatches(_ref2) {
175
171
  if (expValEquals('platform_editor_find_and_replace_improvements', 'isEnabled', true)) {
176
172
  switch (node.type.name) {
177
173
  case 'status':
178
- collectStatusMatch({
174
+ collectNodeMatch({
179
175
  text: node.attrs.text,
180
176
  pos: pos
181
- }, node.nodeSize);
177
+ }, node);
182
178
  break;
183
179
  case 'date':
184
180
  collectNodeMatch({
@@ -186,6 +182,13 @@ export function findMatches(_ref2) {
186
182
  pos: pos
187
183
  }, node);
188
184
  break;
185
+ case 'expand':
186
+ case 'nestedExpand':
187
+ collectNodeMatch({
188
+ text: node.attrs.title,
189
+ pos: pos
190
+ }, node);
191
+ break;
189
192
  case 'mention':
190
193
  var text;
191
194
  if (node.attrs.text) {
@@ -262,6 +265,10 @@ export var prevIndex = function prevIndex(currentIndex, total) {
262
265
  export var getSelectionForMatch = function getSelectionForMatch(selection, doc, index, matches) {
263
266
  var offset = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : 0;
264
267
  if (matches[index]) {
268
+ if (isExpandTitle(matches[index])) {
269
+ // create a text selection at the first position inside the expand body
270
+ return TextSelection.create(doc, matches[index].start + offset - 2);
271
+ }
265
272
  return TextSelection.create(doc, matches[index].start + offset);
266
273
  }
267
274
  return selection;
package/dist/esm/ui/styles.js CHANGED
@@ -1,4 +1,5 @@
1
1
  import _defineProperty from "@babel/runtime/helpers/defineProperty";
2
+ var _css2;
2
3
  /* eslint-disable @atlaskit/editor/no-re-export */
3
4
  // Entry file in package.json
4
5
 
@@ -8,10 +9,18 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
8
9
 
9
10
  import { css } from '@emotion/react';
10
11
  import { N40A, N50A, N60A } from '@atlaskit/theme/colors';
12
+ import { expandClassNames } from '@atlaskit/editor-common/styles';
11
13
  export var searchMatchClass = 'search-match';
14
+ export var searchMatchTextClass = 'search-match-text';
12
15
  export var selectedSearchMatchClass = 'selected-search-match';
13
16
  export var blockSearchMatchClass = 'search-match-block';
17
+ export var selectedBlockSearchMatchClass = 'search-match-block-selected';
14
18
  export var darkModeSearchMatchClass = 'search-match-dark';
19
+ export var searchMatchExpandTitleClass = 'search-match-expand-title';
20
+ var inlineCardSelector = '.loader-wrapper>a';
21
+ var statusSelector = '.lozenge-wrapper';
22
+ var mentionSelector = '.editor-mention-primitive';
23
+ var dateSelector = '.date-lozenger-container';
15
24
  export var findReplaceStyles = css(_defineProperty(_defineProperty({}, ".".concat(searchMatchClass), {
16
25
  borderRadius: '3px',
17
26
  backgroundColor: "var(--ds-background-accent-teal-subtlest, #E7F9FF)",
@@ -19,50 +28,96 @@ export var findReplaceStyles = css(_defineProperty(_defineProperty({}, ".".conca
19
28
  }), ".".concat(selectedSearchMatchClass), {
20
29
  backgroundColor: "var(--ds-background-accent-teal-subtle, #6CC3E0)"
21
30
  }));
22
- export var findReplaceStylesNew = css(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({}, ".".concat(searchMatchClass), {
23
- borderRadius: '3px',
24
- backgroundColor: "var(--ds-background-accent-teal-subtlest, #E7F9FF)",
25
- boxShadow: "var(--ds-shadow-raised, 0 1px 1px 0 rgba(9, 30, 66, 0.25), 0 0 1px 0 rgba(9, 30, 66, 0.31))".concat(", inset 0 0 0 1px ", "var(--ds-border-input, #8590A2)")
26
- }), ".".concat(selectedSearchMatchClass), {
27
- backgroundColor: "var(--ds-background-accent-teal-subtle, #6CC3E0)"
28
- }), ".".concat(blockSearchMatchClass), {
31
+ export var findReplaceStylesNew = css((_css2 = {}, _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_css2, ".".concat(searchMatchTextClass), {
32
+ borderRadius: "var(--ds-space-050, 4px)",
33
+ padding: "var(--ds-space-050, 4px)".concat(" 0"),
34
+ border: "1px solid ".concat("var(--ds-background-accent-yellow-subtler-pressed, #E2B203)"),
35
+ backgroundColor: "var(--ds-background-accent-yellow-subtler, #F8E6A0)",
36
+ color: "var(--ds-text, #172B4D)"
37
+ }), ".".concat(searchMatchTextClass, ".").concat(selectedSearchMatchClass), {
38
+ backgroundColor: "var(--ds-background-accent-yellow-subtlest-pressed, #F5CD47)"
39
+ }), ".".concat(searchMatchTextClass, ".").concat(darkModeSearchMatchClass), {
40
+ border: "1px solid ".concat("var(--ds-background-accent-yellow-bolder, #946F00)"),
41
+ backgroundColor: "var(--ds-background-accent-yellow-bolder-pressed, #533F04)",
42
+ color: "var(--ds-text-inverse, #FFFFFF)"
43
+ }), ".".concat(searchMatchTextClass, ".").concat(selectedSearchMatchClass, ".").concat(darkModeSearchMatchClass), {
44
+ backgroundColor: "var(--ds-background-accent-yellow-bolder-hovered, #7F5F01)"
45
+ }), ".".concat(blockSearchMatchClass), _defineProperty({
29
46
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
30
47
  '[data-smart-link-container="true"], .loader-wrapper>div::after': {
31
48
  boxShadow: "\n\t\t\tinset 0 0 0 1px ".concat("var(--ds-background-accent-yellow-subtler-pressed, #E2B203)", ",\n\t\t\tinset 0 0 0 5px ", "var(--ds-background-accent-yellow-subtler, #F8E6A0)", "\n\t\t\t")
32
49
  }
33
- }), ".".concat(selectedSearchMatchClass, ".").concat(blockSearchMatchClass), {
50
+ }, "".concat(inlineCardSelector, ", ").concat(statusSelector, ", ").concat(mentionSelector, ", ").concat(dateSelector), {
51
+ boxShadow: "0px 0px 0px 4px ".concat("var(--ds-background-accent-yellow-subtler, #F8E6A0)", ", 0px 0px 0px 5px ", "var(--ds-background-accent-yellow-subtler-pressed, #E2B203)"),
52
+ borderRadius: '3px'
53
+ })), ".".concat(blockSearchMatchClass, ".").concat(selectedBlockSearchMatchClass), _defineProperty({
34
54
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
35
55
  '[data-smart-link-container="true"], .loader-wrapper>div::after': {
36
56
  boxShadow: "\n\t\t\tinset 0 0 0 1px ".concat("var(--ds-background-accent-yellow-subtler-pressed, #E2B203)", ",\n\t\t\tinset 0 0 0 4px ", "var(--ds-background-accent-yellow-subtlest-pressed, #F5CD47)", "\n\t\t\t")
37
57
  }
38
- }), ".".concat(blockSearchMatchClass, ".ak-editor-selected-node"), {
58
+ }, "".concat(inlineCardSelector, ", ").concat(statusSelector, ", ").concat(mentionSelector, ", ").concat(dateSelector), {
59
+ boxShadow: "0px 0px 0px 4px ".concat("var(--ds-background-accent-yellow-subtlest-pressed, #F5CD47)", ", 0px 0px 0px 5px ", "var(--ds-background-accent-yellow-subtler-pressed, #E2B203)"),
60
+ borderRadius: '3px'
61
+ })), ".".concat(blockSearchMatchClass, ".ak-editor-selected-node"), _defineProperty({
39
62
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
40
63
  '.loader-wrapper>div::after': {
41
64
  boxShadow: "\n\t\t\tinset 0 0 0 1px ".concat("var(--ds-background-accent-yellow-subtler-pressed, #E2B203)", ",\n\t\t\tinset 0 0 0 5px ", "var(--ds-background-accent-yellow-subtler, #F8E6A0)", ",\n\t\t\t0 0 0 1px ", "var(--ds-border-selected, #0C66E4)", "\n\t\t\t")
42
65
  }
43
- }), ".".concat(selectedSearchMatchClass, ".").concat(blockSearchMatchClass, ".ak-editor-selected-node"), {
66
+ }, "".concat(inlineCardSelector, ", ").concat(statusSelector), {
67
+ // TODO: will clean up !important later
68
+ boxShadow: "0 0 0 1px ".concat("var(--ds-border-selected, #0C66E4)", ", 0px 0px 0px 4px ", "var(--ds-background-accent-yellow-subtler, #F8E6A0)", ", 0px 0px 0px 5px ", "var(--ds-background-accent-yellow-subtler-pressed, #E2B203)", " !important")
69
+ })), ".".concat(blockSearchMatchClass, ".").concat(selectedBlockSearchMatchClass, ".ak-editor-selected-node"), _defineProperty({
44
70
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
45
71
  '[data-smart-link-container="true"], .loader-wrapper>div::after': {
46
72
  boxShadow: "\n\t\t\tinset 0 0 0 1px ".concat("var(--ds-background-accent-yellow-subtler-pressed, #E2B203)", ",\n\t\t\tinset 0 0 0 4px ", "var(--ds-background-accent-yellow-subtlest-pressed, #F5CD47)", ",\n\t\t\t0 0 0 1px ", "var(--ds-border-selected, #0C66E4)", "\n\t\t\t")
47
73
  }
48
- }), ".".concat(blockSearchMatchClass, ".").concat(darkModeSearchMatchClass), {
74
+ }, "".concat(inlineCardSelector, ", ").concat(statusSelector), {
75
+ // TODO: will clean up !important later
76
+ boxShadow: "0 0 0 1px ".concat("var(--ds-border-selected, #0C66E4)", ", 0px 0px 0px 4px ", "var(--ds-background-accent-yellow-subtlest-pressed, #F5CD47)", ", 0px 0px 0px 5px ", "var(--ds-background-accent-yellow-subtler-pressed, #E2B203)", " !important")
77
+ })), ".".concat(blockSearchMatchClass, ".").concat(darkModeSearchMatchClass), _defineProperty({
49
78
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
50
79
  '[data-smart-link-container="true"], .loader-wrapper>div::after': {
51
80
  boxShadow: "\n\t\t\tinset 0 0 0 1px ".concat("var(--ds-background-accent-yellow-bolder, #946F00)", ",\n\t\t\tinset 0 0 0 5px ", "var(--ds-background-accent-yellow-bolder-pressed, #533F04)", "\n\t\t\t")
52
81
  }
53
- }), ".".concat(selectedSearchMatchClass, ".").concat(blockSearchMatchClass, ".").concat(darkModeSearchMatchClass), {
82
+ }, "".concat(inlineCardSelector, ", ").concat(statusSelector, ", ").concat(mentionSelector, ", ").concat(dateSelector), {
83
+ boxShadow: "0px 0px 0px 4px ".concat("var(--ds-background-accent-yellow-bolder-pressed, #533F04)", ", 0px 0px 0px 5px ", "var(--ds-background-accent-yellow-bolder, #946F00)"),
84
+ borderRadius: '3px'
85
+ })), ".".concat(blockSearchMatchClass, ".").concat(selectedBlockSearchMatchClass, ".").concat(darkModeSearchMatchClass), _defineProperty({
54
86
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
55
87
  '[data-smart-link-container="true"], .loader-wrapper>div::after': {
56
88
  boxShadow: "\n\t\t\tinset 0 0 0 1px ".concat("var(--ds-background-accent-yellow-bolder, #946F00)", ",\n\t\t\tinset 0 0 0 4px ", "var(--ds-background-accent-yellow-bolder-hovered, #7F5F01)", "\n\t\t\t")
57
89
  }
58
- }), ".".concat(blockSearchMatchClass, ".").concat(darkModeSearchMatchClass, ".ak-editor-selected-node"), {
90
+ }, "".concat(inlineCardSelector, ", ").concat(statusSelector, ", ").concat(mentionSelector, ", ").concat(dateSelector), {
91
+ boxShadow: "0px 0px 0px 4px ".concat("var(--ds-background-accent-yellow-bolder-hovered, #7F5F01)", ", 0px 0px 0px 5px ", "var(--ds-background-accent-yellow-bolder, #946F00)"),
92
+ borderRadius: '3px'
93
+ })), _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_css2, ".".concat(blockSearchMatchClass, ".").concat(darkModeSearchMatchClass, ".ak-editor-selected-node"), _defineProperty({
59
94
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
60
95
  '.loader-wrapper>div::after': {
61
96
  boxShadow: "\n\t\t\tinset 0 0 0 1px ".concat("var(--ds-background-accent-yellow-bolder, #946F00)", ",\n\t\t\tinset 0 0 0 5px ", "var(--ds-background-accent-yellow-bolder-pressed, #533F04)", ",\n\t\t\t0 0 0 1px ", "var(--ds-border-selected, #0C66E4)", "\n\t\t\t")
62
97
  }
63
- }), ".".concat(selectedSearchMatchClass, ".").concat(blockSearchMatchClass, ".").concat(darkModeSearchMatchClass, ".ak-editor-selected-node"), {
98
+ }, "".concat(inlineCardSelector, ", ").concat(statusSelector), {
99
+ boxShadow: "0 0 0 1px ".concat("var(--ds-border-selected, #0C66E4)", ", 0px 0px 0px 4px ", "var(--ds-background-accent-yellow-bolder-pressed, #533F04)", ", 0px 0px 0px 5px ", "var(--ds-background-accent-yellow-bolder, #946F00)", " !important")
100
+ })), ".".concat(blockSearchMatchClass, ".").concat(selectedBlockSearchMatchClass, ".").concat(darkModeSearchMatchClass, ".ak-editor-selected-node"), _defineProperty({
64
101
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
65
102
  '[data-smart-link-container="true"], .loader-wrapper>div::after': {
66
103
  boxShadow: "\n\t\t\tinset 0 0 0 1px ".concat("var(--ds-background-accent-yellow-bolder, #946F00)", ",\n\t\t\tinset 0 0 0 4px ", "var(--ds-background-accent-yellow-bolder-hovered, #7F5F01)", ",\n\t\t\t0 0 0 1px ", "var(--ds-border-selected, #0C66E4)", "\n\t\t\t")
67
104
  }
68
- }));
105
+ }, "".concat(inlineCardSelector, ", ").concat(statusSelector), {
106
+ boxShadow: "0 0 0 1px ".concat("var(--ds-border-selected, #0C66E4)", ", 0px 0px 0px 4px ", "var(--ds-background-accent-yellow-bolder-hovered, #7F5F01)", ", 0px 0px 0px 5px ", "var(--ds-background-accent-yellow-bolder, #946F00)", " !important")
107
+ })), ".".concat(searchMatchExpandTitleClass, " > .").concat(expandClassNames.titleContainer, " > .").concat(expandClassNames.inputContainer), _defineProperty({
108
+ borderRadius: "var(--ds-space-050, 4px)",
109
+ padding: "var(--ds-space-050, 4px)".concat(" 0"),
110
+ border: "1px solid ".concat("var(--ds-background-accent-yellow-subtler-pressed, #E2B203)"),
111
+ backgroundColor: "var(--ds-background-accent-yellow-subtler, #F8E6A0)"
112
+ }, ".".concat(expandClassNames.titleInput), {
113
+ color: "var(--ds-text, #172B4D)"
114
+ })), ".".concat(searchMatchExpandTitleClass, ".").concat(selectedSearchMatchClass, " > .").concat(expandClassNames.titleContainer, " > .").concat(expandClassNames.inputContainer), {
115
+ backgroundColor: "var(--ds-background-accent-yellow-subtlest-pressed, #F5CD47)"
116
+ }), ".".concat(searchMatchExpandTitleClass, ".").concat(darkModeSearchMatchClass, " > .").concat(expandClassNames.titleContainer, " > .").concat(expandClassNames.inputContainer), _defineProperty({
117
+ border: "1px solid ".concat("var(--ds-background-accent-yellow-bolder, #946F00)"),
118
+ backgroundColor: "var(--ds-background-accent-yellow-bolder-pressed, #533F04)"
119
+ }, ".".concat(expandClassNames.titleInput), {
120
+ color: "var(--ds-text-inverse, #FFFFFF)"
121
+ })), ".".concat(searchMatchExpandTitleClass, ".").concat(selectedSearchMatchClass, ".").concat(darkModeSearchMatchClass, " > .").concat(expandClassNames.titleContainer, " > .").concat(expandClassNames.inputContainer), {
122
+ backgroundColor: "var(--ds-background-accent-yellow-bolder-hovered, #7F5F01)"
123
+ })));
package/dist/types/pm-plugins/utils/index.d.ts CHANGED
@@ -10,7 +10,7 @@ import { FindReplacePlugin } from '../../findReplacePluginType';
10
10
  import type { Match } from '../../types';
11
11
  export declare function getSelectedText(selection: TextSelection): string;
12
12
  export declare const createDecorations: (selectedIndex: number, matches: Match[]) => Decoration[];
13
- export declare const createDecoration: (start: number, end: number, isSelected?: Boolean, nodeType?: string) => Decoration;
13
+ export declare const createDecoration: (match: Match, isSelected?: Boolean) => Decoration;
14
14
  type FindMatchesType = {
15
15
  content: PmNode | Fragment;
16
16
  searchText: string;
package/dist/types/ui/styles.d.ts CHANGED
@@ -1,6 +1,9 @@
1
1
  export declare const searchMatchClass = "search-match";
2
+ export declare const searchMatchTextClass = "search-match-text";
2
3
  export declare const selectedSearchMatchClass = "selected-search-match";
3
4
  export declare const blockSearchMatchClass = "search-match-block";
5
+ export declare const selectedBlockSearchMatchClass = "search-match-block-selected";
4
6
  export declare const darkModeSearchMatchClass = "search-match-dark";
7
+ export declare const searchMatchExpandTitleClass = "search-match-expand-title";
5
8
  export declare const findReplaceStyles: import("@emotion/react").SerializedStyles;
6
9
  export declare const findReplaceStylesNew: import("@emotion/react").SerializedStyles;
package/dist/types-ts4.5/pm-plugins/utils/index.d.ts CHANGED
@@ -10,7 +10,7 @@ import { FindReplacePlugin } from '../../findReplacePluginType';
10
10
  import type { Match } from '../../types';
11
11
  export declare function getSelectedText(selection: TextSelection): string;
12
12
  export declare const createDecorations: (selectedIndex: number, matches: Match[]) => Decoration[];
13
- export declare const createDecoration: (start: number, end: number, isSelected?: Boolean, nodeType?: string) => Decoration;
13
+ export declare const createDecoration: (match: Match, isSelected?: Boolean) => Decoration;
14
14
  type FindMatchesType = {
15
15
  content: PmNode | Fragment;
16
16
  searchText: string;
package/dist/types-ts4.5/ui/styles.d.ts CHANGED
@@ -1,6 +1,9 @@
1
1
  export declare const searchMatchClass = "search-match";
2
+ export declare const searchMatchTextClass = "search-match-text";
2
3
  export declare const selectedSearchMatchClass = "selected-search-match";
3
4
  export declare const blockSearchMatchClass = "search-match-block";
5
+ export declare const selectedBlockSearchMatchClass = "search-match-block-selected";
4
6
  export declare const darkModeSearchMatchClass = "search-match-dark";
7
+ export declare const searchMatchExpandTitleClass = "search-match-expand-title";
5
8
  export declare const findReplaceStyles: import("@emotion/react").SerializedStyles;
6
9
  export declare const findReplaceStylesNew: import("@emotion/react").SerializedStyles;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-plugin-find-replace",
3
- "version": "2.8.0",
3
+ "version": "2.10.0",
4
4
  "description": "find replace plugin for @atlaskit/editor-core",
5
5
  "author": "Atlassian Pty Ltd",
6
6
  "license": "Apache-2.0",
@@ -47,7 +47,7 @@
47
47
  "@atlaskit/primitives": "^14.9.0",
48
48
  "@atlaskit/textfield": "^8.0.0",
49
49
  "@atlaskit/theme": "^18.0.0",
50
- "@atlaskit/tmp-editor-statsig": "^8.2.0",
50
+ "@atlaskit/tmp-editor-statsig": "^8.3.0",
51
51
  "@atlaskit/tokens": "^5.4.0",
52
52
  "@atlaskit/tooltip": "^20.3.0",
53
53
  "@babel/runtime": "^7.0.0",