@atlaskit/editor-plugin-floating-toolbar 9.1.28 → 10.0.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.
package/CHANGELOG.md CHANGED
@@ -1,5 +1,23 @@
1
1
  # @atlaskit/editor-plugin-floating-toolbar
2
2
 
3
+ ## 10.0.0
4
+
5
+ ### Patch Changes
6
+
7
+ - Updated dependencies
8
+
9
+ ## 9.2.0
10
+
11
+ ### Minor Changes
12
+
13
+ - [`dd5154ad0dec5`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/dd5154ad0dec5) -
14
+ [A11Y-10416] Don't render announcer for floating toolbar when a component has another method of
15
+ announcing (codeclocks only)
16
+
17
+ ### Patch Changes
18
+
19
+ - Updated dependencies
20
+
3
21
  ## 9.1.28
4
22
 
5
23
  ### Patch Changes
@@ -596,6 +596,14 @@ var Toolbar = /*#__PURE__*/function (_Component) {
596
596
  //Alt + F10 to reach first element in this floating toolbar
597
597
  return event.altKey && (event.key === 'F10' || event.keyCode === 121);
598
598
  });
599
+ (0, _defineProperty2.default)(_this, "doesNodeRequireAssitiveMessage", function (node) {
600
+ // Code blocks have an assistive message to announce the content of the code block to screen readers, so we don't need to announce the floating toolbar for those nodes
601
+ var nodesWithAlternativeRoles = ['codeBlock'];
602
+ if (nodesWithAlternativeRoles.includes(node.type.name)) {
603
+ return false;
604
+ }
605
+ return true;
606
+ });
599
607
  _this.scrollContainerRef = /*#__PURE__*/_react.default.createRef();
600
608
  _this.mountRef = /*#__PURE__*/_react.default.createRef();
601
609
  _this.toolbarContainerRef = /*#__PURE__*/_react.default.createRef();
@@ -685,6 +693,7 @@ var Toolbar = /*#__PURE__*/function (_Component) {
685
693
  var hasSelect = items.find(function (item) {
686
694
  return item.type === 'select' && item.selectType === 'list';
687
695
  });
696
+ var shouldRenderAssistiveAnnouncer = (0, _expValEquals.expValEquals)('editor_a11y_role_textbox', 'isEnabled', true) ? this.doesNodeRequireAssitiveMessage(node) : true;
688
697
  return (0, _react2.jsx)(_react.default.Fragment, null, (0, _react2.jsx)(_uiMenu.ToolbarArrowKeyNavigationProvider, {
689
698
  editorView: this.props.editorView,
690
699
  handleEscape: this.handleEscape,
@@ -704,7 +713,7 @@ var Toolbar = /*#__PURE__*/function (_Component) {
704
713
  ,
705
714
  className: className,
706
715
  onMouseDown: areAnyNewToolbarFlagsEnabled ? this.captureMouseEvent : undefined
707
- }, (0, _react2.jsx)(_ui.Announcer, {
716
+ }, shouldRenderAssistiveAnnouncer && (0, _react2.jsx)(_ui.Announcer, {
708
717
  text: mediaAssistiveMessage ? "".concat(mediaAssistiveMessage, ", ").concat(intl.formatMessage(_floatingToolbar.messages.floatingToolbarAnnouncer)) : intl.formatMessage(_floatingToolbar.messages.floatingToolbarAnnouncer),
709
718
  delay: 250
710
719
  }), scrollable && areAnyNewToolbarFlagsEnabled && (0, _react2.jsx)(_ScrollButton.ScrollButton, {
@@ -556,6 +556,14 @@ class Toolbar extends Component {
556
556
  //Alt + F10 to reach first element in this floating toolbar
557
557
  return event.altKey && (event.key === 'F10' || event.keyCode === 121);
558
558
  });
559
+ _defineProperty(this, "doesNodeRequireAssitiveMessage", node => {
560
+ // Code blocks have an assistive message to announce the content of the code block to screen readers, so we don't need to announce the floating toolbar for those nodes
561
+ const nodesWithAlternativeRoles = ['codeBlock'];
562
+ if (nodesWithAlternativeRoles.includes(node.type.name)) {
563
+ return false;
564
+ }
565
+ return true;
566
+ });
559
567
  this.scrollContainerRef = /*#__PURE__*/React.createRef();
560
568
  this.mountRef = /*#__PURE__*/React.createRef();
561
569
  this.toolbarContainerRef = /*#__PURE__*/React.createRef();
@@ -636,6 +644,7 @@ class Toolbar extends Component {
636
644
  // Select has left padding of 4px to the border, everything else 8px
637
645
  const firstElementIsSelect = items[0].type === 'select';
638
646
  const hasSelect = items.find(item => item.type === 'select' && item.selectType === 'list');
647
+ const shouldRenderAssistiveAnnouncer = expValEquals('editor_a11y_role_textbox', 'isEnabled', true) ? this.doesNodeRequireAssitiveMessage(node) : true;
639
648
  return jsx(React.Fragment, null, jsx(ToolbarArrowKeyNavigationProvider, {
640
649
  editorView: this.props.editorView,
641
650
  handleEscape: this.handleEscape,
@@ -653,7 +662,7 @@ class Toolbar extends Component {
653
662
  ,
654
663
  className: className,
655
664
  onMouseDown: areAnyNewToolbarFlagsEnabled ? this.captureMouseEvent : undefined
656
- }, jsx(Announcer, {
665
+ }, shouldRenderAssistiveAnnouncer && jsx(Announcer, {
657
666
  text: mediaAssistiveMessage ? `${mediaAssistiveMessage}, ${intl.formatMessage(messages.floatingToolbarAnnouncer)}` : intl.formatMessage(messages.floatingToolbarAnnouncer),
658
667
  delay: 250
659
668
  }), scrollable && areAnyNewToolbarFlagsEnabled && jsx(ScrollButton, {
@@ -590,6 +590,14 @@ var Toolbar = /*#__PURE__*/function (_Component) {
590
590
  //Alt + F10 to reach first element in this floating toolbar
591
591
  return event.altKey && (event.key === 'F10' || event.keyCode === 121);
592
592
  });
593
+ _defineProperty(_this, "doesNodeRequireAssitiveMessage", function (node) {
594
+ // Code blocks have an assistive message to announce the content of the code block to screen readers, so we don't need to announce the floating toolbar for those nodes
595
+ var nodesWithAlternativeRoles = ['codeBlock'];
596
+ if (nodesWithAlternativeRoles.includes(node.type.name)) {
597
+ return false;
598
+ }
599
+ return true;
600
+ });
593
601
  _this.scrollContainerRef = /*#__PURE__*/React.createRef();
594
602
  _this.mountRef = /*#__PURE__*/React.createRef();
595
603
  _this.toolbarContainerRef = /*#__PURE__*/React.createRef();
@@ -679,6 +687,7 @@ var Toolbar = /*#__PURE__*/function (_Component) {
679
687
  var hasSelect = items.find(function (item) {
680
688
  return item.type === 'select' && item.selectType === 'list';
681
689
  });
690
+ var shouldRenderAssistiveAnnouncer = expValEquals('editor_a11y_role_textbox', 'isEnabled', true) ? this.doesNodeRequireAssitiveMessage(node) : true;
682
691
  return jsx(React.Fragment, null, jsx(ToolbarArrowKeyNavigationProvider, {
683
692
  editorView: this.props.editorView,
684
693
  handleEscape: this.handleEscape,
@@ -698,7 +707,7 @@ var Toolbar = /*#__PURE__*/function (_Component) {
698
707
  ,
699
708
  className: className,
700
709
  onMouseDown: areAnyNewToolbarFlagsEnabled ? this.captureMouseEvent : undefined
701
- }, jsx(Announcer, {
710
+ }, shouldRenderAssistiveAnnouncer && jsx(Announcer, {
702
711
  text: mediaAssistiveMessage ? "".concat(mediaAssistiveMessage, ", ").concat(intl.formatMessage(messages.floatingToolbarAnnouncer)) : intl.formatMessage(messages.floatingToolbarAnnouncer),
703
712
  delay: 250
704
713
  }), scrollable && areAnyNewToolbarFlagsEnabled && jsx(ScrollButton, {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-plugin-floating-toolbar",
3
- "version": "9.1.28",
3
+ "version": "10.0.0",
4
4
  "description": "Floating toolbar plugin for @atlaskit/editor-core",
5
5
  "author": "Atlassian Pty Ltd",
6
6
  "license": "Apache-2.0",
@@ -25,16 +25,16 @@
25
25
  "@atlaskit/button": "^23.10.0",
26
26
  "@atlaskit/checkbox": "^17.3.0",
27
27
  "@atlaskit/editor-palette": "^2.1.0",
28
- "@atlaskit/editor-plugin-analytics": "^7.0.0",
29
- "@atlaskit/editor-plugin-context-panel": "^9.0.0",
30
- "@atlaskit/editor-plugin-copy-button": "^7.1.0",
31
- "@atlaskit/editor-plugin-decorations": "^7.0.0",
32
- "@atlaskit/editor-plugin-editor-disabled": "^7.0.0",
33
- "@atlaskit/editor-plugin-editor-viewmode": "^9.0.0",
34
- "@atlaskit/editor-plugin-emoji": "^8.1.0",
35
- "@atlaskit/editor-plugin-extension": "^10.1.0",
36
- "@atlaskit/editor-plugin-interaction": "^14.0.0",
37
- "@atlaskit/editor-plugin-user-intent": "^5.0.0",
28
+ "@atlaskit/editor-plugin-analytics": "^8.0.0",
29
+ "@atlaskit/editor-plugin-context-panel": "^10.0.0",
30
+ "@atlaskit/editor-plugin-copy-button": "^8.0.0",
31
+ "@atlaskit/editor-plugin-decorations": "^8.0.0",
32
+ "@atlaskit/editor-plugin-editor-disabled": "^8.0.0",
33
+ "@atlaskit/editor-plugin-editor-viewmode": "^10.0.0",
34
+ "@atlaskit/editor-plugin-emoji": "^9.0.0",
35
+ "@atlaskit/editor-plugin-extension": "^11.0.0",
36
+ "@atlaskit/editor-plugin-interaction": "^15.0.0",
37
+ "@atlaskit/editor-plugin-user-intent": "^6.0.0",
38
38
  "@atlaskit/editor-prosemirror": "^7.3.0",
39
39
  "@atlaskit/emoji": "^69.10.0",
40
40
  "@atlaskit/icon": "^32.0.0",
@@ -44,8 +44,8 @@
44
44
  "@atlaskit/primitives": "^18.0.0",
45
45
  "@atlaskit/select": "^21.7.0",
46
46
  "@atlaskit/theme": "^22.0.0",
47
- "@atlaskit/tmp-editor-statsig": "^35.0.0",
48
- "@atlaskit/tokens": "^11.0.0",
47
+ "@atlaskit/tmp-editor-statsig": "^35.10.0",
48
+ "@atlaskit/tokens": "^11.1.0",
49
49
  "@atlaskit/tooltip": "^20.14.0",
50
50
  "@babel/runtime": "^7.0.0",
51
51
  "@emotion/react": "^11.7.1",
@@ -56,7 +56,7 @@
56
56
  "react-loadable": "^5.1.0"
57
57
  },
58
58
  "peerDependencies": {
59
- "@atlaskit/editor-common": "^111.30.0",
59
+ "@atlaskit/editor-common": "^112.0.0",
60
60
  "react": "^18.2.0",
61
61
  "react-dom": "^18.2.0"
62
62
  },