@atlaskit/editor-plugin-type-ahead 8.0.10 → 8.0.12

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,19 @@
1
1
  # @atlaskit/editor-plugin-type-ahead
2
2
 
3
+ ## 8.0.12
4
+
5
+ ### Patch Changes
6
+
7
+ - Updated dependencies
8
+
9
+ ## 8.0.11
10
+
11
+ ### Patch Changes
12
+
13
+ - [`0f4a08b633f6e`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/0f4a08b633f6e) -
14
+ Internal changes to remove unnecessary token fallbacks and imports from `@atlaskit/theme`
15
+ - Updated dependencies
16
+
3
17
  ## 8.0.10
4
18
 
5
19
  ### Patch Changes
@@ -13,7 +13,6 @@ var _state = require("@atlaskit/editor-prosemirror/state");
13
13
  var _view = require("@atlaskit/editor-prosemirror/view");
14
14
  var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
15
15
  var _prosemirrorHistory = require("@atlaskit/prosemirror-history");
16
- var _colors = require("@atlaskit/theme/colors");
17
16
  var _WrapperTypeAhead = require("../ui/WrapperTypeAhead");
18
17
  var _closeTypeAhead = require("./commands/close-type-ahead");
19
18
  var _constants = require("./constants");
@@ -65,7 +64,7 @@ var factoryDecorations = exports.factoryDecorations = function factoryDecoration
65
64
  // packages/editor/editor-core/src/ui/Addon/click-area-helper.ts
66
65
  typeaheadComponent.dataset.editorPopup = 'true';
67
66
  typeaheadComponent.dataset.typeAhead = _constants.TYPE_AHEAD_DECORATION_DATA_ATTRIBUTE;
68
- typeaheadComponent.style.color = "var(--ds-text-accent-blue, ".concat(_colors.B400, ")");
67
+ typeaheadComponent.style.color = "var(--ds-text-accent-blue, #1558BC)";
69
68
  typeaheadComponent.style.backgroundColor = 'transparent';
70
69
  var onUndoRedo = function onUndoRedo(inputType) {
71
70
  if (!['historyUndo', 'historyRedo'].includes(inputType)) {
@@ -37,7 +37,7 @@ function ContentComponent(_ref) {
37
37
  return /*#__PURE__*/_react.default.createElement(_TypeAheadMenu.TypeAheadMenu, {
38
38
  editorView: editorView,
39
39
  popupMountRef: popupMountRef
40
- // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
40
+ // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
41
41
  ,
42
42
  typeAheadState: {
43
43
  triggerHandler: triggerHandler,
@@ -61,7 +61,7 @@ var querySpanStyles = (0, _react2.css)({
61
61
  fontSize: '1em',
62
62
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
63
63
  height: _editorSharedStyles.blockNodesVerticalMargin,
64
- caretColor: "var(--ds-text-accent-blue, #0052CC)"
64
+ caretColor: "var(--ds-text-accent-blue, #1558BC)"
65
65
  }
66
66
  });
67
67
  var isNavigationKey = function isNavigationKey(event) {
@@ -9,7 +9,6 @@ var _react = _interopRequireWildcard(require("react"));
9
9
  var _react2 = require("@emotion/react");
10
10
  var _browser = require("@atlaskit/editor-common/browser");
11
11
  var _menu = require("@atlaskit/menu");
12
- var _colors = require("@atlaskit/theme/colors");
13
12
  var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
14
13
  function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
15
14
  /**
@@ -22,11 +21,11 @@ function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r
22
21
  var buttonStyles = (0, _react2.css)({
23
22
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
24
23
  '& > button:hover': {
25
- backgroundColor: "var(--ds-background-neutral-subtle-hovered, ".concat(_colors.N30, ")")
24
+ backgroundColor: "var(--ds-background-neutral-subtle-hovered, #0515240F)"
26
25
  },
27
26
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
28
27
  '& > button:focus': {
29
- backgroundColor: "var(--ds-background-neutral-subtle-hovered, ".concat(_colors.N30, ")")
28
+ backgroundColor: "var(--ds-background-neutral-subtle-hovered, #0515240F)"
30
29
  }
31
30
  });
32
31
  var MoreOptions = exports.MoreOptions = function MoreOptions(_ref) {
@@ -30,7 +30,7 @@ var TypeAheadErrorFallback = exports.TypeAheadErrorFallback = function TypeAhead
30
30
  css: minHeightComponentStyles
31
31
  }, (0, _react.jsx)(_EmptyState.EmptyState, {
32
32
  header: header
33
- // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
33
+ // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
34
34
  ,
35
35
  renderImage: function renderImage() {
36
36
  return (0, _react.jsx)(_GenericErrorSVG.GenericErrorSVG, null);
@@ -327,7 +327,7 @@ var TypeAheadListComponent = /*#__PURE__*/_react.default.memo(function (_ref2) {
327
327
  style: style,
328
328
  isVisible: isVisible,
329
329
  isScrolling: isScrolling
330
- // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
330
+ // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
331
331
  ,
332
332
  onMouseMove: function onMouseMove(e) {
333
333
  return _onMouseMove(e, index);
@@ -339,7 +339,7 @@ var TypeAheadListComponent = /*#__PURE__*/_react.default.memo(function (_ref2) {
339
339
  itemsLength: itemsLength,
340
340
  itemIndex: index,
341
341
  selectedIndex: selectedIndex
342
- // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
342
+ // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
343
343
  ,
344
344
  onItemClick: function onItemClick(mode, index) {
345
345
  actions.onItemClick(mode, index, _analytics.INPUT_METHOD.MOUSE);
@@ -385,7 +385,7 @@ var TypeAheadListComponent = /*#__PURE__*/_react.default.memo(function (_ref2) {
385
385
  "aria-label": (0, _utils.getTypeAheadListAriaLabels)(undefined, intl).popupAriaLabel,
386
386
  containerRole: "presentation",
387
387
  role: "listbox"
388
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
388
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
389
389
  ,
390
390
  css: [
391
391
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
@@ -18,7 +18,6 @@ var _editorPluginConnectivity = require("@atlaskit/editor-plugin-connectivity");
18
18
  var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
19
19
  var _shortcut = require("@atlaskit/editor-shared-styles/shortcut");
20
20
  var _menu = require("@atlaskit/menu");
21
- var _colors = require("@atlaskit/theme/colors");
22
21
  var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
23
22
  var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
24
23
  var _visuallyHidden = _interopRequireDefault(require("@atlaskit/visually-hidden"));
@@ -34,7 +33,7 @@ var itemIcon = exports.itemIcon = (0, _react2.css)({
34
33
  width: "var(--ds-space-500, 40px)",
35
34
  height: "var(--ds-space-500, 40px)",
36
35
  overflow: 'hidden',
37
- border: "var(--ds-border-width, 1px)".concat(" solid ", "var(--ds-border, rgba(223, 225, 229, 0.5))") /* N60 at 50% */,
36
+ border: "var(--ds-border-width, 1px)".concat(" solid ", "var(--ds-border, #0B120E24)") /* N60 at 50% */,
38
37
  borderRadius: "var(--ds-radius-small, 3px)",
39
38
  boxSizing: 'border-box',
40
39
  display: 'flex',
@@ -61,7 +60,7 @@ var itemIconSizeUpdated = (0, _react2.css)({
61
60
  var itemBody = (0, _react2.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n\tdisplay: flex;\n\tflex-direction: row;\n\tflex-wrap: nowrap;\n\tjustify-content: space-between;\n"])));
62
61
  var itemText = (0, _react2.css)({
63
62
  whiteSpace: 'initial',
64
- color: "".concat("var(--ds-text, ".concat(_colors.N800, ")"))
63
+ color: "var(--ds-text, #292A2E)"
65
64
  });
66
65
  var itemTitle = (0, _react2.css)({
67
66
  // eslint-disable-next-line @atlaskit/design-system/use-tokens-typography
@@ -85,7 +84,7 @@ var itemDescriptionOverride = (0, _react2.css)({
85
84
  var itemAfter = (0, _react2.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n\tflex: 0 0 auto;\n"])));
86
85
 
87
86
  // eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression -- Ignored via go/DSP-18766
88
- var customRenderItemDivStyle = (0, _react2.css)(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n\toverflow: hidden;\n\t&:focus {\n\t\tbox-shadow: inset 2px 0px 0px ", ";\n\t\tbackground-color: ", ";\n\t\toutline: none;\n\t}\n"])), "var(--ds-border-focused, ".concat(_colors.B400, ")"), "var(--ds-background-neutral-subtle-hovered, ".concat(_colors.N30, ")"));
87
+ var customRenderItemDivStyle = (0, _react2.css)(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n\toverflow: hidden;\n\t&:focus {\n\t\tbox-shadow: inset 2px 0px 0px ", ";\n\t\tbackground-color: ", ";\n\t\toutline: none;\n\t}\n"])), "var(--ds-border-focused, #4688EC)", "var(--ds-background-neutral-subtle-hovered, #0515240F)");
89
88
 
90
89
  /**
91
90
  * This CSS emulates the desired behaviour with :focus-visible for firefox.
@@ -94,8 +93,8 @@ var customRenderItemDivStyle = (0, _react2.css)(_templateObject3 || (_templateOb
94
93
  */
95
94
  var selectionFrame = {
96
95
  '& > button:focus': {
97
- boxShadow: "inset 2px 0px 0px ".concat("var(--ds-border-focused, ".concat(_colors.B400, ")"), ";"),
98
- backgroundColor: "".concat("var(--ds-background-neutral-subtle-hovered, ".concat(_colors.N30, ")")),
96
+ boxShadow: "inset 2px 0px 0px ".concat("var(--ds-border-focused, #4688EC)", ";"),
97
+ backgroundColor: "var(--ds-background-neutral-subtle-hovered, #0515240F)",
99
98
  outline: 'none',
100
99
  '&:active': {
101
100
  boxShadow: 'none'
@@ -108,7 +107,7 @@ var selectionFrame = {
108
107
  };
109
108
 
110
109
  // eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression -- Ignored via go/DSP-18766
111
- var selectedStyle = (0, _react2.css)(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n\tbackground-color: ", ";\n\tbox-shadow: inset 2px 0px 0px ", ";\n"])), "var(--ds-background-neutral-subtle-hovered, ".concat(_colors.N30, ")"), "var(--ds-border-focused, ".concat(_colors.B400, ")"));
110
+ var selectedStyle = (0, _react2.css)(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n\tbackground-color: ", ";\n\tbox-shadow: inset 2px 0px 0px ", ";\n"])), "var(--ds-background-neutral-subtle-hovered, #0515240F)", "var(--ds-border-focused, #4688EC)");
112
111
  var disabledStyle = (0, _react2.css)({
113
112
  color: "var(--ds-text-disabled, #080F214A)"
114
113
  });
@@ -16,7 +16,6 @@ var _typeAhead = require("@atlaskit/editor-common/type-ahead");
16
16
  var _ui = require("@atlaskit/editor-common/ui");
17
17
  var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
18
18
  var _featureGateJsClient = _interopRequireDefault(require("@atlaskit/feature-gate-js-client"));
19
- var _colors = require("@atlaskit/theme/colors");
20
19
  var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
21
20
  var _analytics2 = require("../pm-plugins/analytics");
22
21
  var _constants = require("../pm-plugins/constants");
@@ -36,9 +35,9 @@ var VIEWMORE_BUTTON_HEIGHT = 53;
36
35
  var DEFAULT_TYPEAHEAD_MENU_HEIGHT_NEW = 480;
37
36
  var ITEM_PADDING = 12;
38
37
  var typeAheadContent = (0, _react2.css)({
39
- background: "var(--ds-surface-overlay, ".concat(_colors.N0, ")"),
38
+ background: "var(--ds-surface-overlay, #FFFFFF)",
40
39
  borderRadius: "var(--ds-radius-small, 3px)",
41
- boxShadow: "var(--ds-shadow-overlay, ".concat("0 0 1px ".concat(_colors.N60A, ", 0 4px 8px -2px ").concat(_colors.N50A), ")"),
40
+ boxShadow: "var(--ds-shadow-overlay, 0px 8px 12px #1E1F2126, 0px 0px 1px #1E1F214f)",
42
41
  padding: "var(--ds-space-050, 4px)".concat(" 0"),
43
42
  width: '320px',
44
43
  maxHeight: '380px' /* ~5.5 visibile items */,
@@ -320,7 +319,7 @@ var TypeAheadPopup = exports.TypeAheadPopup = /*#__PURE__*/_react.default.memo(f
320
319
  offset: OFFSET,
321
320
  ariaLabel: null,
322
321
  preventOverflow: true
323
- // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
322
+ // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
324
323
  ,
325
324
  onUnmount: function onUnmount() {
326
325
  if (selectedIndex > -1 && (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1')) {
@@ -348,7 +347,7 @@ var TypeAheadPopup = exports.TypeAheadPopup = /*#__PURE__*/_react.default.memo(f
348
347
  }), (0, _react2.jsx)(_TypeAheadList.TypeAheadList, {
349
348
  items: items,
350
349
  selectedIndex: selectedIndex
351
- // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
350
+ // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
352
351
  ,
353
352
  onItemClick: function onItemClick(mode, index, inputMethod) {
354
353
  if ((0, _experiments.editorExperiment)('platform_editor_controls', 'variant1')) {
@@ -7,7 +7,6 @@ import { TextSelection } from '@atlaskit/editor-prosemirror/state';
7
7
  import { Decoration, DecorationSet } from '@atlaskit/editor-prosemirror/view';
8
8
  import { fg } from '@atlaskit/platform-feature-flags';
9
9
  import { redo, undo } from '@atlaskit/prosemirror-history';
10
- import { B400 } from '@atlaskit/theme/colors';
11
10
  import { WrapperTypeAhead } from '../ui/WrapperTypeAhead';
12
11
  import { closeTypeAhead } from './commands/close-type-ahead';
13
12
  import { TYPE_AHEAD_DECORATION_DATA_ATTRIBUTE, TYPE_AHEAD_DECORATION_KEY } from './constants';
@@ -63,7 +62,7 @@ export const factoryDecorations = ({
63
62
  // packages/editor/editor-core/src/ui/Addon/click-area-helper.ts
64
63
  typeaheadComponent.dataset.editorPopup = 'true';
65
64
  typeaheadComponent.dataset.typeAhead = TYPE_AHEAD_DECORATION_DATA_ATTRIBUTE;
66
- typeaheadComponent.style.color = `var(--ds-text-accent-blue, ${B400})`;
65
+ typeaheadComponent.style.color = "var(--ds-text-accent-blue, #1558BC)";
67
66
  typeaheadComponent.style.backgroundColor = 'transparent';
68
67
  const onUndoRedo = inputType => {
69
68
  if (!['historyUndo', 'historyRedo'].includes(inputType)) {
@@ -32,7 +32,7 @@ export function ContentComponent({
32
32
  return /*#__PURE__*/React.createElement(TypeAheadMenu, {
33
33
  editorView: editorView,
34
34
  popupMountRef: popupMountRef
35
- // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
35
+ // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
36
36
  ,
37
37
  typeAheadState: {
38
38
  triggerHandler,
@@ -50,7 +50,7 @@ const querySpanStyles = css({
50
50
  fontSize: '1em',
51
51
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
52
52
  height: blockNodesVerticalMargin,
53
- caretColor: "var(--ds-text-accent-blue, #0052CC)"
53
+ caretColor: "var(--ds-text-accent-blue, #1558BC)"
54
54
  }
55
55
  });
56
56
  const isNavigationKey = event => {
@@ -8,16 +8,15 @@ import React, { useEffect, useRef } from 'react';
8
8
  import { css, jsx } from '@emotion/react';
9
9
  import { getBrowserInfo } from '@atlaskit/editor-common/browser';
10
10
  import { ButtonItem, Section } from '@atlaskit/menu';
11
- import { N30 } from '@atlaskit/theme/colors';
12
11
  import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
13
12
  const buttonStyles = css({
14
13
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
15
14
  '& > button:hover': {
16
- backgroundColor: `var(--ds-background-neutral-subtle-hovered, ${N30})`
15
+ backgroundColor: "var(--ds-background-neutral-subtle-hovered, #0515240F)"
17
16
  },
18
17
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
19
18
  '& > button:focus': {
20
- backgroundColor: `var(--ds-background-neutral-subtle-hovered, ${N30})`
19
+ backgroundColor: "var(--ds-background-neutral-subtle-hovered, #0515240F)"
21
20
  }
22
21
  });
23
22
  export const MoreOptions = ({
@@ -23,7 +23,7 @@ export const TypeAheadErrorFallback = () => {
23
23
  css: minHeightComponentStyles
24
24
  }, jsx(EmptyState, {
25
25
  header: header
26
- // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
26
+ // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
27
27
  ,
28
28
  renderImage: () => jsx(GenericErrorSVG, null),
29
29
  description: description
@@ -310,7 +310,7 @@ const TypeAheadListComponent = /*#__PURE__*/React.memo(({
310
310
  style: style,
311
311
  isVisible: isVisible,
312
312
  isScrolling: isScrolling
313
- // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
313
+ // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
314
314
  ,
315
315
  onMouseMove: e => onMouseMove(e, index)
316
316
  }, jsx(TypeAheadListItem, {
@@ -320,7 +320,7 @@ const TypeAheadListComponent = /*#__PURE__*/React.memo(({
320
320
  itemsLength: itemsLength,
321
321
  itemIndex: index,
322
322
  selectedIndex: selectedIndex
323
- // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
323
+ // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
324
324
  ,
325
325
  onItemClick: (mode, index) => {
326
326
  actions.onItemClick(mode, index, INPUT_METHOD.MOUSE);
@@ -365,7 +365,7 @@ const TypeAheadListComponent = /*#__PURE__*/React.memo(({
365
365
  "aria-label": getTypeAheadListAriaLabels(undefined, intl).popupAriaLabel,
366
366
  containerRole: "presentation",
367
367
  role: "listbox"
368
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
368
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
369
369
  ,
370
370
  css: [
371
371
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
@@ -15,7 +15,6 @@ import { isOfflineMode } from '@atlaskit/editor-plugin-connectivity';
15
15
  import { relativeFontSizeToBase16 } from '@atlaskit/editor-shared-styles';
16
16
  import { shortcutStyle } from '@atlaskit/editor-shared-styles/shortcut';
17
17
  import { ButtonItem } from '@atlaskit/menu';
18
- import { B400, N30, N800 } from '@atlaskit/theme/colors';
19
18
  import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
20
19
  import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
21
20
  import VisuallyHidden from '@atlaskit/visually-hidden';
@@ -24,7 +23,7 @@ export const itemIcon = css({
24
23
  width: "var(--ds-space-500, 40px)",
25
24
  height: "var(--ds-space-500, 40px)",
26
25
  overflow: 'hidden',
27
- border: `${"var(--ds-border-width, 1px)"} solid ${"var(--ds-border, rgba(223, 225, 229, 0.5))"}` /* N60 at 50% */,
26
+ border: `${"var(--ds-border-width, 1px)"} solid ${"var(--ds-border, #0B120E24)"}` /* N60 at 50% */,
28
27
  borderRadius: "var(--ds-radius-small, 3px)",
29
28
  boxSizing: 'border-box',
30
29
  display: 'flex',
@@ -56,7 +55,7 @@ const itemBody = css`
56
55
  `;
57
56
  const itemText = css({
58
57
  whiteSpace: 'initial',
59
- color: `${`var(--ds-text, ${N800})`}`
58
+ color: `${"var(--ds-text, #292A2E)"}`
60
59
  });
61
60
  const itemTitle = css({
62
61
  // eslint-disable-next-line @atlaskit/design-system/use-tokens-typography
@@ -85,8 +84,8 @@ const itemAfter = css`
85
84
  const customRenderItemDivStyle = css`
86
85
  overflow: hidden;
87
86
  &:focus {
88
- box-shadow: inset 2px 0px 0px ${`var(--ds-border-focused, ${B400})`};
89
- background-color: ${`var(--ds-background-neutral-subtle-hovered, ${N30})`};
87
+ box-shadow: inset 2px 0px 0px ${"var(--ds-border-focused, #4688EC)"};
88
+ background-color: ${"var(--ds-background-neutral-subtle-hovered, #0515240F)"};
90
89
  outline: none;
91
90
  }
92
91
  `;
@@ -98,8 +97,8 @@ const customRenderItemDivStyle = css`
98
97
  */
99
98
  const selectionFrame = {
100
99
  '& > button:focus': {
101
- boxShadow: `inset 2px 0px 0px ${`var(--ds-border-focused, ${B400})`};`,
102
- backgroundColor: `${`var(--ds-background-neutral-subtle-hovered, ${N30})`}`,
100
+ boxShadow: `inset 2px 0px 0px ${"var(--ds-border-focused, #4688EC)"};`,
101
+ backgroundColor: `${"var(--ds-background-neutral-subtle-hovered, #0515240F)"}`,
103
102
  outline: 'none',
104
103
  '&:active': {
105
104
  boxShadow: 'none'
@@ -113,8 +112,8 @@ const selectionFrame = {
113
112
 
114
113
  // eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression -- Ignored via go/DSP-18766
115
114
  const selectedStyle = css`
116
- background-color: ${`var(--ds-background-neutral-subtle-hovered, ${N30})`};
117
- box-shadow: inset 2px 0px 0px ${`var(--ds-border-focused, ${B400})`};
115
+ background-color: ${"var(--ds-background-neutral-subtle-hovered, #0515240F)"};
116
+ box-shadow: inset 2px 0px 0px ${"var(--ds-border-focused, #4688EC)"};
118
117
  `;
119
118
  const disabledStyle = css({
120
119
  color: "var(--ds-text-disabled, #080F214A)"
@@ -13,7 +13,6 @@ import { TypeAheadAvailableNodes } from '@atlaskit/editor-common/type-ahead';
13
13
  import { findOverflowScrollParent, Popup } from '@atlaskit/editor-common/ui';
14
14
  import { akEditorFloatingDialogZIndex } from '@atlaskit/editor-shared-styles';
15
15
  import FeatureGates from '@atlaskit/feature-gate-js-client';
16
- import { N0, N50A, N60A } from '@atlaskit/theme/colors';
17
16
  import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
18
17
  import { fireTypeAheadClosedAnalyticsEvent } from '../pm-plugins/analytics';
19
18
  import { CloseSelectionOptions, TYPE_AHEAD_DECORATION_DATA_ATTRIBUTE, TYPE_AHEAD_POPUP_CONTENT_CLASS } from '../pm-plugins/constants';
@@ -25,9 +24,9 @@ const VIEWMORE_BUTTON_HEIGHT = 53;
25
24
  const DEFAULT_TYPEAHEAD_MENU_HEIGHT_NEW = 480;
26
25
  const ITEM_PADDING = 12;
27
26
  const typeAheadContent = css({
28
- background: `var(--ds-surface-overlay, ${N0})`,
27
+ background: "var(--ds-surface-overlay, #FFFFFF)",
29
28
  borderRadius: "var(--ds-radius-small, 3px)",
30
- boxShadow: `var(--ds-shadow-overlay, ${`0 0 1px ${N60A}, 0 4px 8px -2px ${N50A}`})`,
29
+ boxShadow: "var(--ds-shadow-overlay, 0px 8px 12px #1E1F2126, 0px 0px 1px #1E1F214f)",
31
30
  padding: `${"var(--ds-space-050, 4px)"} 0`,
32
31
  width: '320px',
33
32
  maxHeight: '380px' /* ~5.5 visibile items */,
@@ -316,7 +315,7 @@ export const TypeAheadPopup = /*#__PURE__*/React.memo(props => {
316
315
  offset: OFFSET,
317
316
  ariaLabel: null,
318
317
  preventOverflow: true
319
- // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
318
+ // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
320
319
  ,
321
320
  onUnmount: () => {
322
321
  if (selectedIndex > -1 && editorExperiment('platform_editor_controls', 'variant1')) {
@@ -344,7 +343,7 @@ export const TypeAheadPopup = /*#__PURE__*/React.memo(props => {
344
343
  }), jsx(TypeAheadList, {
345
344
  items: items,
346
345
  selectedIndex: selectedIndex
347
- // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
346
+ // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
348
347
  ,
349
348
  onItemClick: (mode, index, inputMethod) => {
350
349
  if (editorExperiment('platform_editor_controls', 'variant1')) {
@@ -7,7 +7,6 @@ import { TextSelection } from '@atlaskit/editor-prosemirror/state';
7
7
  import { Decoration, DecorationSet } from '@atlaskit/editor-prosemirror/view';
8
8
  import { fg } from '@atlaskit/platform-feature-flags';
9
9
  import { redo, undo } from '@atlaskit/prosemirror-history';
10
- import { B400 } from '@atlaskit/theme/colors';
11
10
  import { WrapperTypeAhead } from '../ui/WrapperTypeAhead';
12
11
  import { closeTypeAhead } from './commands/close-type-ahead';
13
12
  import { TYPE_AHEAD_DECORATION_DATA_ATTRIBUTE, TYPE_AHEAD_DECORATION_KEY } from './constants';
@@ -57,7 +56,7 @@ export var factoryDecorations = function factoryDecorations(_ref) {
57
56
  // packages/editor/editor-core/src/ui/Addon/click-area-helper.ts
58
57
  typeaheadComponent.dataset.editorPopup = 'true';
59
58
  typeaheadComponent.dataset.typeAhead = TYPE_AHEAD_DECORATION_DATA_ATTRIBUTE;
60
- typeaheadComponent.style.color = "var(--ds-text-accent-blue, ".concat(B400, ")");
59
+ typeaheadComponent.style.color = "var(--ds-text-accent-blue, #1558BC)";
61
60
  typeaheadComponent.style.backgroundColor = 'transparent';
62
61
  var onUndoRedo = function onUndoRedo(inputType) {
63
62
  if (!['historyUndo', 'historyRedo'].includes(inputType)) {
@@ -30,7 +30,7 @@ export function ContentComponent(_ref) {
30
30
  return /*#__PURE__*/React.createElement(TypeAheadMenu, {
31
31
  editorView: editorView,
32
32
  popupMountRef: popupMountRef
33
- // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
33
+ // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
34
34
  ,
35
35
  typeAheadState: {
36
36
  triggerHandler: triggerHandler,
@@ -51,7 +51,7 @@ var querySpanStyles = css({
51
51
  fontSize: '1em',
52
52
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
53
53
  height: blockNodesVerticalMargin,
54
- caretColor: "var(--ds-text-accent-blue, #0052CC)"
54
+ caretColor: "var(--ds-text-accent-blue, #1558BC)"
55
55
  }
56
56
  });
57
57
  var isNavigationKey = function isNavigationKey(event) {
@@ -8,16 +8,15 @@ import React, { useEffect, useRef } from 'react';
8
8
  import { css, jsx } from '@emotion/react';
9
9
  import { getBrowserInfo } from '@atlaskit/editor-common/browser';
10
10
  import { ButtonItem, Section } from '@atlaskit/menu';
11
- import { N30 } from '@atlaskit/theme/colors';
12
11
  import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
13
12
  var buttonStyles = css({
14
13
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
15
14
  '& > button:hover': {
16
- backgroundColor: "var(--ds-background-neutral-subtle-hovered, ".concat(N30, ")")
15
+ backgroundColor: "var(--ds-background-neutral-subtle-hovered, #0515240F)"
17
16
  },
18
17
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
19
18
  '& > button:focus': {
20
- backgroundColor: "var(--ds-background-neutral-subtle-hovered, ".concat(N30, ")")
19
+ backgroundColor: "var(--ds-background-neutral-subtle-hovered, #0515240F)"
21
20
  }
22
21
  });
23
22
  export var MoreOptions = function MoreOptions(_ref) {
@@ -23,7 +23,7 @@ export var TypeAheadErrorFallback = function TypeAheadErrorFallback() {
23
23
  css: minHeightComponentStyles
24
24
  }, jsx(EmptyState, {
25
25
  header: header
26
- // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
26
+ // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
27
27
  ,
28
28
  renderImage: function renderImage() {
29
29
  return jsx(GenericErrorSVG, null);
@@ -318,7 +318,7 @@ var TypeAheadListComponent = /*#__PURE__*/React.memo(function (_ref2) {
318
318
  style: style,
319
319
  isVisible: isVisible,
320
320
  isScrolling: isScrolling
321
- // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
321
+ // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
322
322
  ,
323
323
  onMouseMove: function onMouseMove(e) {
324
324
  return _onMouseMove(e, index);
@@ -330,7 +330,7 @@ var TypeAheadListComponent = /*#__PURE__*/React.memo(function (_ref2) {
330
330
  itemsLength: itemsLength,
331
331
  itemIndex: index,
332
332
  selectedIndex: selectedIndex
333
- // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
333
+ // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
334
334
  ,
335
335
  onItemClick: function onItemClick(mode, index) {
336
336
  actions.onItemClick(mode, index, INPUT_METHOD.MOUSE);
@@ -376,7 +376,7 @@ var TypeAheadListComponent = /*#__PURE__*/React.memo(function (_ref2) {
376
376
  "aria-label": getTypeAheadListAriaLabels(undefined, intl).popupAriaLabel,
377
377
  containerRole: "presentation",
378
378
  role: "listbox"
379
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
379
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
380
380
  ,
381
381
  css: [
382
382
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
@@ -17,7 +17,6 @@ import { isOfflineMode } from '@atlaskit/editor-plugin-connectivity';
17
17
  import { relativeFontSizeToBase16 } from '@atlaskit/editor-shared-styles';
18
18
  import { shortcutStyle } from '@atlaskit/editor-shared-styles/shortcut';
19
19
  import { ButtonItem } from '@atlaskit/menu';
20
- import { B400, N30, N800 } from '@atlaskit/theme/colors';
21
20
  import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
22
21
  import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
23
22
  import VisuallyHidden from '@atlaskit/visually-hidden';
@@ -26,7 +25,7 @@ export var itemIcon = css({
26
25
  width: "var(--ds-space-500, 40px)",
27
26
  height: "var(--ds-space-500, 40px)",
28
27
  overflow: 'hidden',
29
- border: "var(--ds-border-width, 1px)".concat(" solid ", "var(--ds-border, rgba(223, 225, 229, 0.5))") /* N60 at 50% */,
28
+ border: "var(--ds-border-width, 1px)".concat(" solid ", "var(--ds-border, #0B120E24)") /* N60 at 50% */,
30
29
  borderRadius: "var(--ds-radius-small, 3px)",
31
30
  boxSizing: 'border-box',
32
31
  display: 'flex',
@@ -53,7 +52,7 @@ var itemIconSizeUpdated = css({
53
52
  var itemBody = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n\tdisplay: flex;\n\tflex-direction: row;\n\tflex-wrap: nowrap;\n\tjustify-content: space-between;\n"])));
54
53
  var itemText = css({
55
54
  whiteSpace: 'initial',
56
- color: "".concat("var(--ds-text, ".concat(N800, ")"))
55
+ color: "var(--ds-text, #292A2E)"
57
56
  });
58
57
  var itemTitle = css({
59
58
  // eslint-disable-next-line @atlaskit/design-system/use-tokens-typography
@@ -77,7 +76,7 @@ var itemDescriptionOverride = css({
77
76
  var itemAfter = css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n\tflex: 0 0 auto;\n"])));
78
77
 
79
78
  // eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression -- Ignored via go/DSP-18766
80
- var customRenderItemDivStyle = css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n\toverflow: hidden;\n\t&:focus {\n\t\tbox-shadow: inset 2px 0px 0px ", ";\n\t\tbackground-color: ", ";\n\t\toutline: none;\n\t}\n"])), "var(--ds-border-focused, ".concat(B400, ")"), "var(--ds-background-neutral-subtle-hovered, ".concat(N30, ")"));
79
+ var customRenderItemDivStyle = css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n\toverflow: hidden;\n\t&:focus {\n\t\tbox-shadow: inset 2px 0px 0px ", ";\n\t\tbackground-color: ", ";\n\t\toutline: none;\n\t}\n"])), "var(--ds-border-focused, #4688EC)", "var(--ds-background-neutral-subtle-hovered, #0515240F)");
81
80
 
82
81
  /**
83
82
  * This CSS emulates the desired behaviour with :focus-visible for firefox.
@@ -86,8 +85,8 @@ var customRenderItemDivStyle = css(_templateObject3 || (_templateObject3 = _tagg
86
85
  */
87
86
  var selectionFrame = {
88
87
  '& > button:focus': {
89
- boxShadow: "inset 2px 0px 0px ".concat("var(--ds-border-focused, ".concat(B400, ")"), ";"),
90
- backgroundColor: "".concat("var(--ds-background-neutral-subtle-hovered, ".concat(N30, ")")),
88
+ boxShadow: "inset 2px 0px 0px ".concat("var(--ds-border-focused, #4688EC)", ";"),
89
+ backgroundColor: "var(--ds-background-neutral-subtle-hovered, #0515240F)",
91
90
  outline: 'none',
92
91
  '&:active': {
93
92
  boxShadow: 'none'
@@ -100,7 +99,7 @@ var selectionFrame = {
100
99
  };
101
100
 
102
101
  // eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression -- Ignored via go/DSP-18766
103
- var selectedStyle = css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n\tbackground-color: ", ";\n\tbox-shadow: inset 2px 0px 0px ", ";\n"])), "var(--ds-background-neutral-subtle-hovered, ".concat(N30, ")"), "var(--ds-border-focused, ".concat(B400, ")"));
102
+ var selectedStyle = css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n\tbackground-color: ", ";\n\tbox-shadow: inset 2px 0px 0px ", ";\n"])), "var(--ds-background-neutral-subtle-hovered, #0515240F)", "var(--ds-border-focused, #4688EC)");
104
103
  var disabledStyle = css({
105
104
  color: "var(--ds-text-disabled, #080F214A)"
106
105
  });
@@ -14,7 +14,6 @@ import { TypeAheadAvailableNodes } from '@atlaskit/editor-common/type-ahead';
14
14
  import { findOverflowScrollParent, Popup } from '@atlaskit/editor-common/ui';
15
15
  import { akEditorFloatingDialogZIndex } from '@atlaskit/editor-shared-styles';
16
16
  import FeatureGates from '@atlaskit/feature-gate-js-client';
17
- import { N0, N50A, N60A } from '@atlaskit/theme/colors';
18
17
  import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
19
18
  import { fireTypeAheadClosedAnalyticsEvent } from '../pm-plugins/analytics';
20
19
  import { CloseSelectionOptions, TYPE_AHEAD_DECORATION_DATA_ATTRIBUTE, TYPE_AHEAD_POPUP_CONTENT_CLASS } from '../pm-plugins/constants';
@@ -26,9 +25,9 @@ var VIEWMORE_BUTTON_HEIGHT = 53;
26
25
  var DEFAULT_TYPEAHEAD_MENU_HEIGHT_NEW = 480;
27
26
  var ITEM_PADDING = 12;
28
27
  var typeAheadContent = css({
29
- background: "var(--ds-surface-overlay, ".concat(N0, ")"),
28
+ background: "var(--ds-surface-overlay, #FFFFFF)",
30
29
  borderRadius: "var(--ds-radius-small, 3px)",
31
- boxShadow: "var(--ds-shadow-overlay, ".concat("0 0 1px ".concat(N60A, ", 0 4px 8px -2px ").concat(N50A), ")"),
30
+ boxShadow: "var(--ds-shadow-overlay, 0px 8px 12px #1E1F2126, 0px 0px 1px #1E1F214f)",
32
31
  padding: "var(--ds-space-050, 4px)".concat(" 0"),
33
32
  width: '320px',
34
33
  maxHeight: '380px' /* ~5.5 visibile items */,
@@ -310,7 +309,7 @@ export var TypeAheadPopup = /*#__PURE__*/React.memo(function (props) {
310
309
  offset: OFFSET,
311
310
  ariaLabel: null,
312
311
  preventOverflow: true
313
- // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
312
+ // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
314
313
  ,
315
314
  onUnmount: function onUnmount() {
316
315
  if (selectedIndex > -1 && editorExperiment('platform_editor_controls', 'variant1')) {
@@ -338,7 +337,7 @@ export var TypeAheadPopup = /*#__PURE__*/React.memo(function (props) {
338
337
  }), jsx(TypeAheadList, {
339
338
  items: items,
340
339
  selectedIndex: selectedIndex
341
- // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
340
+ // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
342
341
  ,
343
342
  onItemClick: function onItemClick(mode, index, inputMethod) {
344
343
  if (editorExperiment('platform_editor_controls', 'variant1')) {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-plugin-type-ahead",
3
- "version": "8.0.10",
3
+ "version": "8.0.12",
4
4
  "description": "Type-ahead plugin for @atlaskit/editor-core",
5
5
  "author": "Atlassian Pty Ltd",
6
6
  "license": "Apache-2.0",
@@ -44,8 +44,7 @@
44
44
  "@atlaskit/primitives": "^18.0.0",
45
45
  "@atlaskit/prosemirror-history": "^0.2.0",
46
46
  "@atlaskit/prosemirror-input-rules": "^3.6.0",
47
- "@atlaskit/theme": "^22.0.0",
48
- "@atlaskit/tmp-editor-statsig": "^44.0.0",
47
+ "@atlaskit/tmp-editor-statsig": "^45.0.0",
49
48
  "@atlaskit/tokens": "^11.1.0",
50
49
  "@atlaskit/visually-hidden": "^3.0.0",
51
50
  "@babel/runtime": "^7.0.0",
@@ -57,7 +56,7 @@
57
56
  "w3c-keyname": "^2.1.8"
58
57
  },
59
58
  "peerDependencies": {
60
- "@atlaskit/editor-common": "^112.7.0",
59
+ "@atlaskit/editor-common": "^112.8.0",
61
60
  "react": "^18.2.0",
62
61
  "react-dom": "^18.2.0",
63
62
  "react-intl-next": "npm:react-intl@^5.18.1"