@atlaskit/editor-common 96.5.0 → 96.5.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md CHANGED
@@ -1,5 +1,13 @@
1
1
  # @atlaskit/editor-common
2
2
 
3
+ ## 96.5.1
4
+
5
+ ### Patch Changes
6
+
7
+ - [#178536](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/178536)
8
+ [`2809409329363`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/2809409329363) -
9
+ Adds keyboard events to select/de-select the bodied macros EditToggle for accessibility
10
+
3
11
  ## 96.5.0
4
12
 
5
13
  ### Minor Changes
@@ -41,7 +41,11 @@ var buttonStyles = (0, _react2.css)({
41
41
  font: "var(--ds-font-body, normal 400 14px/20px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif)",
42
42
  '&:hover': {
43
43
  backgroundColor: "var(--ds-background-neutral-subtle-hovered, #091E420F)"
44
- }
44
+ },
45
+ outlineColor: "var(--ds-border-focused, #388BFF)",
46
+ border: 'none',
47
+ backgroundColor: "var(--ds-background-neutral-subtle, #00000000)",
48
+ color: "var(--ds-text-subtle, #44546F)"
45
49
  });
46
50
  var showButtonContainerStyle = (0, _react2.css)({
47
51
  opacity: 1
@@ -80,6 +84,11 @@ var EditToggle = exports.EditToggle = function EditToggle(_ref) {
80
84
  var handleClick = (0, _react.useCallback)(function () {
81
85
  setShowBodiedExtensionRendererView === null || setShowBodiedExtensionRendererView === void 0 || setShowBodiedExtensionRendererView(!showBodiedExtensionRendererView);
82
86
  }, [showBodiedExtensionRendererView, setShowBodiedExtensionRendererView]);
87
+ var handleKeyDown = (0, _react.useCallback)(function (event) {
88
+ if (event.key === 'Enter') {
89
+ handleClick();
90
+ }
91
+ }, [handleClick]);
83
92
  return (
84
93
  // eslint-disable-next-line jsx-a11y/no-static-element-interactions
85
94
  (0, _react2.jsx)("div", {
@@ -100,8 +109,10 @@ var EditToggle = exports.EditToggle = function EditToggle(_ref) {
100
109
  },
101
110
  onMouseLeave: function onMouseLeave() {
102
111
  return setIsNodeHovered === null || setIsNodeHovered === void 0 ? void 0 : setIsNodeHovered(false);
103
- }
104
- }, (0, _react2.jsx)("span", {
112
+ },
113
+ tabIndex: -1
114
+ }, (0, _react2.jsx)("button", {
115
+ type: "button",
105
116
  "data-testid": "edit-toggle"
106
117
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
107
118
  ,
@@ -109,7 +120,14 @@ var EditToggle = exports.EditToggle = function EditToggle(_ref) {
109
120
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
110
121
  ,
111
122
  className: "extension-edit-toggle",
112
- onClick: handleClick
123
+ onClick: handleClick,
124
+ onKeyDown: handleKeyDown,
125
+ onFocus: function onFocus() {
126
+ return setIsNodeHovered === null || setIsNodeHovered === void 0 ? void 0 : setIsNodeHovered(true);
127
+ },
128
+ onBlur: function onBlur() {
129
+ return setIsNodeHovered === null || setIsNodeHovered === void 0 ? void 0 : setIsNodeHovered(false);
130
+ }
113
131
  }, (0, _react2.jsx)(_primitives.Flex, {
114
132
  as: "span",
115
133
  xcss: iconStyles
@@ -17,7 +17,7 @@ function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return
17
17
  function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
18
18
  var SENTRY_DSN = 'https://0b10c8e02fb44d8796c047b102c9bee8@o55978.ingest.sentry.io/4505129224110080';
19
19
  var packageName = 'editor-common'; // Sentry doesn't accept '/' in its releases https://docs.sentry.io/platforms/javascript/configuration/releases/
20
- var packageVersion = "96.5.0";
20
+ var packageVersion = "96.5.1";
21
21
  var sanitiseSentryEvents = function sanitiseSentryEvents(data, _hint) {
22
22
  // Remove URL as it has UGC
23
23
  // TODO: Sanitise the URL instead of just removing it
@@ -23,7 +23,7 @@ function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.
23
23
  * @jsx jsx
24
24
  */ // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
25
25
  var packageName = "@atlaskit/editor-common";
26
- var packageVersion = "96.5.0";
26
+ var packageVersion = "96.5.1";
27
27
  var halfFocusRing = 1;
28
28
  var dropOffset = '0, 8';
29
29
  var DropList = /*#__PURE__*/function (_Component) {
@@ -34,7 +34,11 @@ const buttonStyles = css({
34
34
  font: "var(--ds-font-body, normal 400 14px/20px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif)",
35
35
  '&:hover': {
36
36
  backgroundColor: "var(--ds-background-neutral-subtle-hovered, #091E420F)"
37
- }
37
+ },
38
+ outlineColor: "var(--ds-border-focused, #388BFF)",
39
+ border: 'none',
40
+ backgroundColor: "var(--ds-background-neutral-subtle, #00000000)",
41
+ color: "var(--ds-text-subtle, #44546F)"
38
42
  });
39
43
  const showButtonContainerStyle = css({
40
44
  opacity: 1
@@ -74,6 +78,11 @@ export const EditToggle = ({
74
78
  const handleClick = useCallback(() => {
75
79
  setShowBodiedExtensionRendererView === null || setShowBodiedExtensionRendererView === void 0 ? void 0 : setShowBodiedExtensionRendererView(!showBodiedExtensionRendererView);
76
80
  }, [showBodiedExtensionRendererView, setShowBodiedExtensionRendererView]);
81
+ const handleKeyDown = useCallback(event => {
82
+ if (event.key === 'Enter') {
83
+ handleClick();
84
+ }
85
+ }, [handleClick]);
77
86
  return (
78
87
  // eslint-disable-next-line jsx-a11y/no-static-element-interactions
79
88
  jsx("div", {
@@ -90,8 +99,10 @@ export const EditToggle = ({
90
99
  // eslint-disable-next-line jsx-a11y/mouse-events-have-key-events
91
100
  ,
92
101
  onMouseOver: () => setIsNodeHovered === null || setIsNodeHovered === void 0 ? void 0 : setIsNodeHovered(true),
93
- onMouseLeave: () => setIsNodeHovered === null || setIsNodeHovered === void 0 ? void 0 : setIsNodeHovered(false)
94
- }, jsx("span", {
102
+ onMouseLeave: () => setIsNodeHovered === null || setIsNodeHovered === void 0 ? void 0 : setIsNodeHovered(false),
103
+ tabIndex: -1
104
+ }, jsx("button", {
105
+ type: "button",
95
106
  "data-testid": "edit-toggle"
96
107
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
97
108
  ,
@@ -99,7 +110,10 @@ export const EditToggle = ({
99
110
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
100
111
  ,
101
112
  className: "extension-edit-toggle",
102
- onClick: handleClick
113
+ onClick: handleClick,
114
+ onKeyDown: handleKeyDown,
115
+ onFocus: () => setIsNodeHovered === null || setIsNodeHovered === void 0 ? void 0 : setIsNodeHovered(true),
116
+ onBlur: () => setIsNodeHovered === null || setIsNodeHovered === void 0 ? void 0 : setIsNodeHovered(false)
103
117
  }, jsx(Flex, {
104
118
  as: "span",
105
119
  xcss: iconStyles
@@ -1,7 +1,7 @@
1
1
  import { isFedRamp } from './environment';
2
2
  const SENTRY_DSN = 'https://0b10c8e02fb44d8796c047b102c9bee8@o55978.ingest.sentry.io/4505129224110080';
3
3
  const packageName = 'editor-common'; // Sentry doesn't accept '/' in its releases https://docs.sentry.io/platforms/javascript/configuration/releases/
4
- const packageVersion = "96.5.0";
4
+ const packageVersion = "96.5.1";
5
5
  const sanitiseSentryEvents = (data, _hint) => {
6
6
  // Remove URL as it has UGC
7
7
  // TODO: Sanitise the URL instead of just removing it
@@ -13,7 +13,7 @@ import withAnalyticsContext from '@atlaskit/analytics-next/withAnalyticsContext'
13
13
  import withAnalyticsEvents from '@atlaskit/analytics-next/withAnalyticsEvents';
14
14
  import Layer from '../Layer';
15
15
  const packageName = "@atlaskit/editor-common";
16
- const packageVersion = "96.5.0";
16
+ const packageVersion = "96.5.1";
17
17
  const halfFocusRing = 1;
18
18
  const dropOffset = '0, 8';
19
19
  class DropList extends Component {
@@ -34,7 +34,11 @@ var buttonStyles = css({
34
34
  font: "var(--ds-font-body, normal 400 14px/20px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif)",
35
35
  '&:hover': {
36
36
  backgroundColor: "var(--ds-background-neutral-subtle-hovered, #091E420F)"
37
- }
37
+ },
38
+ outlineColor: "var(--ds-border-focused, #388BFF)",
39
+ border: 'none',
40
+ backgroundColor: "var(--ds-background-neutral-subtle, #00000000)",
41
+ color: "var(--ds-text-subtle, #44546F)"
38
42
  });
39
43
  var showButtonContainerStyle = css({
40
44
  opacity: 1
@@ -73,6 +77,11 @@ export var EditToggle = function EditToggle(_ref) {
73
77
  var handleClick = useCallback(function () {
74
78
  setShowBodiedExtensionRendererView === null || setShowBodiedExtensionRendererView === void 0 || setShowBodiedExtensionRendererView(!showBodiedExtensionRendererView);
75
79
  }, [showBodiedExtensionRendererView, setShowBodiedExtensionRendererView]);
80
+ var handleKeyDown = useCallback(function (event) {
81
+ if (event.key === 'Enter') {
82
+ handleClick();
83
+ }
84
+ }, [handleClick]);
76
85
  return (
77
86
  // eslint-disable-next-line jsx-a11y/no-static-element-interactions
78
87
  jsx("div", {
@@ -93,8 +102,10 @@ export var EditToggle = function EditToggle(_ref) {
93
102
  },
94
103
  onMouseLeave: function onMouseLeave() {
95
104
  return setIsNodeHovered === null || setIsNodeHovered === void 0 ? void 0 : setIsNodeHovered(false);
96
- }
97
- }, jsx("span", {
105
+ },
106
+ tabIndex: -1
107
+ }, jsx("button", {
108
+ type: "button",
98
109
  "data-testid": "edit-toggle"
99
110
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
100
111
  ,
@@ -102,7 +113,14 @@ export var EditToggle = function EditToggle(_ref) {
102
113
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
103
114
  ,
104
115
  className: "extension-edit-toggle",
105
- onClick: handleClick
116
+ onClick: handleClick,
117
+ onKeyDown: handleKeyDown,
118
+ onFocus: function onFocus() {
119
+ return setIsNodeHovered === null || setIsNodeHovered === void 0 ? void 0 : setIsNodeHovered(true);
120
+ },
121
+ onBlur: function onBlur() {
122
+ return setIsNodeHovered === null || setIsNodeHovered === void 0 ? void 0 : setIsNodeHovered(false);
123
+ }
106
124
  }, jsx(Flex, {
107
125
  as: "span",
108
126
  xcss: iconStyles
@@ -7,7 +7,7 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
7
7
  import { isFedRamp } from './environment';
8
8
  var SENTRY_DSN = 'https://0b10c8e02fb44d8796c047b102c9bee8@o55978.ingest.sentry.io/4505129224110080';
9
9
  var packageName = 'editor-common'; // Sentry doesn't accept '/' in its releases https://docs.sentry.io/platforms/javascript/configuration/releases/
10
- var packageVersion = "96.5.0";
10
+ var packageVersion = "96.5.1";
11
11
  var sanitiseSentryEvents = function sanitiseSentryEvents(data, _hint) {
12
12
  // Remove URL as it has UGC
13
13
  // TODO: Sanitise the URL instead of just removing it
@@ -20,7 +20,7 @@ import withAnalyticsContext from '@atlaskit/analytics-next/withAnalyticsContext'
20
20
  import withAnalyticsEvents from '@atlaskit/analytics-next/withAnalyticsEvents';
21
21
  import Layer from '../Layer';
22
22
  var packageName = "@atlaskit/editor-common";
23
- var packageVersion = "96.5.0";
23
+ var packageVersion = "96.5.1";
24
24
  var halfFocusRing = 1;
25
25
  var dropOffset = '0, 8';
26
26
  var DropList = /*#__PURE__*/function (_Component) {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-common",
3
- "version": "96.5.0",
3
+ "version": "96.5.1",
4
4
  "description": "A package that contains common classes and components for editor and renderer",
5
5
  "publishConfig": {
6
6
  "registry": "https://registry.npmjs.org/"