@ckeditor/ckeditor5-ui 41.1.0 → 41.3.0-alpha.0

package/lang/translations/sr-latn.po

@@ -144,3 +144,27 @@ msgstr ""
 msgctxt "The label and the tooltip for the close button in the dialog header."
 msgid "Close"
 msgstr ""
+
+msgctxt "Accessibility help dialog assistive technologies label telling users how to exit the dialog."
+msgid "Help Contents. To close this dialog press ESC."
+msgstr ""
+
+msgctxt "Accessibility help dialog text explaining what can be found in that dialog."
+msgid "Below, you can find a list of keyboard shortcuts that can be used in the editor."
+msgstr ""
+
+msgctxt "Accessibility help dialog text displayed next to keystrokes that may require the Fn key on Mac."
+msgid "(may require <kbd>Fn</kbd>)"
+msgstr ""
+
+msgctxt "Accessibility help dialog title."
+msgid "Accessibility help"
+msgstr ""
+
+msgctxt "Assistive technologies label added to each editor editing area informing users about the possibility of opening the accessibility help dialog."
+msgid "Press %0 for help."
+msgstr ""
+
+msgctxt "Keystroke description for assistive technologies: keystroke for moving focus out of an active dialog window."
+msgid "Move focus in and out of an active dialog window"
+msgstr ""

package/lang/translations/sr.po

@@ -144,3 +144,27 @@ msgstr "Dijalog za uređivanje"
 msgctxt "The label and the tooltip for the close button in the dialog header."
 msgid "Close"
 msgstr "Zatvori"
+
+msgctxt "Accessibility help dialog assistive technologies label telling users how to exit the dialog."
+msgid "Help Contents. To close this dialog press ESC."
+msgstr "Sadržaji za pomoć. Kako biste zatvorili ovaj dijalog pritisnite taster ESC."
+
+msgctxt "Accessibility help dialog text explaining what can be found in that dialog."
+msgid "Below, you can find a list of keyboard shortcuts that can be used in the editor."
+msgstr "Ispod možete pronaći listu prečica na tastaturi koje se mogu koristiti u uređivaču."
+
+msgctxt "Accessibility help dialog text displayed next to keystrokes that may require the Fn key on Mac."
+msgid "(may require <kbd>Fn</kbd>)"
+msgstr "(možda će biti neophodan <kbd>Fn</kbd>)"
+
+msgctxt "Accessibility help dialog title."
+msgid "Accessibility help"
+msgstr "Pomoć oko pristupačnosti"
+
+msgctxt "Assistive technologies label added to each editor editing area informing users about the possibility of opening the accessibility help dialog."
+msgid "Press %0 for help."
+msgstr "Pritisni %0 za pomoć."
+
+msgctxt "Keystroke description for assistive technologies: keystroke for moving focus out of an active dialog window."
+msgid "Move focus in and out of an active dialog window"
+msgstr "Pomeri fokus u i van aktivnog prozora dijaloga"

package/lang/translations/sv.po

@@ -144,3 +144,27 @@ msgstr "Ordbehandlardialog"
 msgctxt "The label and the tooltip for the close button in the dialog header."
 msgid "Close"
 msgstr "Stäng"
+
+msgctxt "Accessibility help dialog assistive technologies label telling users how to exit the dialog."
+msgid "Help Contents. To close this dialog press ESC."
+msgstr "Hjälpinnehåll. Tryck på ESC för att stänga dialogrutan."
+
+msgctxt "Accessibility help dialog text explaining what can be found in that dialog."
+msgid "Below, you can find a list of keyboard shortcuts that can be used in the editor."
+msgstr "Nedan hittar du en lista med kortkommandon som kan användas i redigeraren."
+
+msgctxt "Accessibility help dialog text displayed next to keystrokes that may require the Fn key on Mac."
+msgid "(may require <kbd>Fn</kbd>)"
+msgstr "(kan kräva <kbd>Fn</kbd>)"
+
+msgctxt "Accessibility help dialog title."
+msgid "Accessibility help"
+msgstr "Hjälp med tillgänglighet"
+
+msgctxt "Assistive technologies label added to each editor editing area informing users about the possibility of opening the accessibility help dialog."
+msgid "Press %0 for help."
+msgstr "Tryck på %0 för hjälp."
+
+msgctxt "Keystroke description for assistive technologies: keystroke for moving focus out of an active dialog window."
+msgid "Move focus in and out of an active dialog window"
+msgstr "Flytta fokus till och från en aktiv dialogruta"

package/lang/translations/th.po

@@ -144,3 +144,27 @@ msgstr "การสนทนาของบรรณาธิการ"
 msgctxt "The label and the tooltip for the close button in the dialog header."
 msgid "Close"
 msgstr "ปิด"
+
+msgctxt "Accessibility help dialog assistive technologies label telling users how to exit the dialog."
+msgid "Help Contents. To close this dialog press ESC."
+msgstr "เนื้อหาความช่วยเหลือ หากต้องการปิดกล่องโต้ตอบนี้ ให้กดปุ่ม ESC"
+
+msgctxt "Accessibility help dialog text explaining what can be found in that dialog."
+msgid "Below, you can find a list of keyboard shortcuts that can be used in the editor."
+msgstr "ด้านล่างนี้ คุณจะพบกับรายการแป้นพิมพ์ลัดที่สามารถใช้ในตัวแก้ไขได้"
+
+msgctxt "Accessibility help dialog text displayed next to keystrokes that may require the Fn key on Mac."
+msgid "(may require <kbd>Fn</kbd>)"
+msgstr "(อาจจำเป็นต้องมี <kbd>Fn</kbd>)"
+
+msgctxt "Accessibility help dialog title."
+msgid "Accessibility help"
+msgstr "ความช่วยเหลือการเข้าถึง"
+
+msgctxt "Assistive technologies label added to each editor editing area informing users about the possibility of opening the accessibility help dialog."
+msgid "Press %0 for help."
+msgstr "กด %0 เพื่อความช่วยเหลือ"
+
+msgctxt "Keystroke description for assistive technologies: keystroke for moving focus out of an active dialog window."
+msgid "Move focus in and out of an active dialog window"
+msgstr "ย้ายโฟกัสเข้าและออกจากกล่องโต้ตอบที่ใช้งานอยู่"

package/lang/translations/tk.po

@@ -144,3 +144,27 @@ msgstr ""
 msgctxt "The label and the tooltip for the close button in the dialog header."
 msgid "Close"
 msgstr ""
+
+msgctxt "Accessibility help dialog assistive technologies label telling users how to exit the dialog."
+msgid "Help Contents. To close this dialog press ESC."
+msgstr ""
+
+msgctxt "Accessibility help dialog text explaining what can be found in that dialog."
+msgid "Below, you can find a list of keyboard shortcuts that can be used in the editor."
+msgstr ""
+
+msgctxt "Accessibility help dialog text displayed next to keystrokes that may require the Fn key on Mac."
+msgid "(may require <kbd>Fn</kbd>)"
+msgstr ""
+
+msgctxt "Accessibility help dialog title."
+msgid "Accessibility help"
+msgstr ""
+
+msgctxt "Assistive technologies label added to each editor editing area informing users about the possibility of opening the accessibility help dialog."
+msgid "Press %0 for help."
+msgstr ""
+
+msgctxt "Keystroke description for assistive technologies: keystroke for moving focus out of an active dialog window."
+msgid "Move focus in and out of an active dialog window"
+msgstr ""

package/lang/translations/tr.po

@@ -144,3 +144,27 @@ msgstr "Düzenleyici iletişim kutusu"
 msgctxt "The label and the tooltip for the close button in the dialog header."
 msgid "Close"
 msgstr "Kapat"
+
+msgctxt "Accessibility help dialog assistive technologies label telling users how to exit the dialog."
+msgid "Help Contents. To close this dialog press ESC."
+msgstr "Yardım İçerikleri. Bu iletişim kutusunu kapatmak için ESC tuşuna basın."
+
+msgctxt "Accessibility help dialog text explaining what can be found in that dialog."
+msgid "Below, you can find a list of keyboard shortcuts that can be used in the editor."
+msgstr "Aşağıda editörde kullanılabilecek klavye kısayollarının bir listesini bulabilirsiniz."
+
+msgctxt "Accessibility help dialog text displayed next to keystrokes that may require the Fn key on Mac."
+msgid "(may require <kbd>Fn</kbd>)"
+msgstr "(<kbd>Fn</kbd> gerekebilir)"
+
+msgctxt "Accessibility help dialog title."
+msgid "Accessibility help"
+msgstr "Erişilebilirlik yardımı"
+
+msgctxt "Assistive technologies label added to each editor editing area informing users about the possibility of opening the accessibility help dialog."
+msgid "Press %0 for help."
+msgstr "Yardım için %0 tuşuna basın."
+
+msgctxt "Keystroke description for assistive technologies: keystroke for moving focus out of an active dialog window."
+msgid "Move focus in and out of an active dialog window"
+msgstr "Odağı etkin iletişim penceresinin içine ve dışına taşı"

package/lang/translations/tt.po

@@ -144,3 +144,27 @@ msgstr ""
 msgctxt "The label and the tooltip for the close button in the dialog header."
 msgid "Close"
 msgstr ""
+
+msgctxt "Accessibility help dialog assistive technologies label telling users how to exit the dialog."
+msgid "Help Contents. To close this dialog press ESC."
+msgstr ""
+
+msgctxt "Accessibility help dialog text explaining what can be found in that dialog."
+msgid "Below, you can find a list of keyboard shortcuts that can be used in the editor."
+msgstr ""
+
+msgctxt "Accessibility help dialog text displayed next to keystrokes that may require the Fn key on Mac."
+msgid "(may require <kbd>Fn</kbd>)"
+msgstr ""
+
+msgctxt "Accessibility help dialog title."
+msgid "Accessibility help"
+msgstr ""
+
+msgctxt "Assistive technologies label added to each editor editing area informing users about the possibility of opening the accessibility help dialog."
+msgid "Press %0 for help."
+msgstr ""
+
+msgctxt "Keystroke description for assistive technologies: keystroke for moving focus out of an active dialog window."
+msgid "Move focus in and out of an active dialog window"
+msgstr ""

package/lang/translations/ug.po

@@ -144,3 +144,27 @@ msgstr ""
 msgctxt "The label and the tooltip for the close button in the dialog header."
 msgid "Close"
 msgstr ""
+
+msgctxt "Accessibility help dialog assistive technologies label telling users how to exit the dialog."
+msgid "Help Contents. To close this dialog press ESC."
+msgstr ""
+
+msgctxt "Accessibility help dialog text explaining what can be found in that dialog."
+msgid "Below, you can find a list of keyboard shortcuts that can be used in the editor."
+msgstr ""
+
+msgctxt "Accessibility help dialog text displayed next to keystrokes that may require the Fn key on Mac."
+msgid "(may require <kbd>Fn</kbd>)"
+msgstr ""
+
+msgctxt "Accessibility help dialog title."
+msgid "Accessibility help"
+msgstr ""
+
+msgctxt "Assistive technologies label added to each editor editing area informing users about the possibility of opening the accessibility help dialog."
+msgid "Press %0 for help."
+msgstr ""
+
+msgctxt "Keystroke description for assistive technologies: keystroke for moving focus out of an active dialog window."
+msgid "Move focus in and out of an active dialog window"
+msgstr ""

package/lang/translations/uk.po

@@ -144,3 +144,27 @@ msgstr "Діалогове вікно редактора"
 msgctxt "The label and the tooltip for the close button in the dialog header."
 msgid "Close"
 msgstr "Закрити"
+
+msgctxt "Accessibility help dialog assistive technologies label telling users how to exit the dialog."
+msgid "Help Contents. To close this dialog press ESC."
+msgstr "Зміст довідки. Щоб закрити це діалогове вікно, натисніть ESC."
+
+msgctxt "Accessibility help dialog text explaining what can be found in that dialog."
+msgid "Below, you can find a list of keyboard shortcuts that can be used in the editor."
+msgstr "Нижче ви можете знайти список комбінацій клавіш, які можна використовувати в редакторі."
+
+msgctxt "Accessibility help dialog text displayed next to keystrokes that may require the Fn key on Mac."
+msgid "(may require <kbd>Fn</kbd>)"
+msgstr "(може вимагати <kbd>Fn</kbd>)"
+
+msgctxt "Accessibility help dialog title."
+msgid "Accessibility help"
+msgstr "Довідка щодо доступності"
+
+msgctxt "Assistive technologies label added to each editor editing area informing users about the possibility of opening the accessibility help dialog."
+msgid "Press %0 for help."
+msgstr "Натисніть %0 для довідки."
+
+msgctxt "Keystroke description for assistive technologies: keystroke for moving focus out of an active dialog window."
+msgid "Move focus in and out of an active dialog window"
+msgstr "Переміщення фокуса в активному діалоговому вікні та з нього"

package/lang/translations/ur.po

@@ -144,3 +144,27 @@ msgstr ""
 msgctxt "The label and the tooltip for the close button in the dialog header."
 msgid "Close"
 msgstr ""
+
+msgctxt "Accessibility help dialog assistive technologies label telling users how to exit the dialog."
+msgid "Help Contents. To close this dialog press ESC."
+msgstr ""
+
+msgctxt "Accessibility help dialog text explaining what can be found in that dialog."
+msgid "Below, you can find a list of keyboard shortcuts that can be used in the editor."
+msgstr ""
+
+msgctxt "Accessibility help dialog text displayed next to keystrokes that may require the Fn key on Mac."
+msgid "(may require <kbd>Fn</kbd>)"
+msgstr ""
+
+msgctxt "Accessibility help dialog title."
+msgid "Accessibility help"
+msgstr ""
+
+msgctxt "Assistive technologies label added to each editor editing area informing users about the possibility of opening the accessibility help dialog."
+msgid "Press %0 for help."
+msgstr ""
+
+msgctxt "Keystroke description for assistive technologies: keystroke for moving focus out of an active dialog window."
+msgid "Move focus in and out of an active dialog window"
+msgstr ""

package/lang/translations/uz.po

@@ -144,3 +144,27 @@ msgstr ""
 msgctxt "The label and the tooltip for the close button in the dialog header."
 msgid "Close"
 msgstr ""
+
+msgctxt "Accessibility help dialog assistive technologies label telling users how to exit the dialog."
+msgid "Help Contents. To close this dialog press ESC."
+msgstr ""
+
+msgctxt "Accessibility help dialog text explaining what can be found in that dialog."
+msgid "Below, you can find a list of keyboard shortcuts that can be used in the editor."
+msgstr ""
+
+msgctxt "Accessibility help dialog text displayed next to keystrokes that may require the Fn key on Mac."
+msgid "(may require <kbd>Fn</kbd>)"
+msgstr ""
+
+msgctxt "Accessibility help dialog title."
+msgid "Accessibility help"
+msgstr ""
+
+msgctxt "Assistive technologies label added to each editor editing area informing users about the possibility of opening the accessibility help dialog."
+msgid "Press %0 for help."
+msgstr ""
+
+msgctxt "Keystroke description for assistive technologies: keystroke for moving focus out of an active dialog window."
+msgid "Move focus in and out of an active dialog window"
+msgstr ""

package/lang/translations/vi.po

@@ -144,3 +144,27 @@ msgstr "Hộp thoại trình biên tập"
 msgctxt "The label and the tooltip for the close button in the dialog header."
 msgid "Close"
 msgstr "Đóng"
+
+msgctxt "Accessibility help dialog assistive technologies label telling users how to exit the dialog."
+msgid "Help Contents. To close this dialog press ESC."
+msgstr "Nội dung Trợ giúp. Nhấn phím ESC để đóng hộp thoại này."
+
+msgctxt "Accessibility help dialog text explaining what can be found in that dialog."
+msgid "Below, you can find a list of keyboard shortcuts that can be used in the editor."
+msgstr "Dưới đây, bạn có thể tìm thấy danh sách các phím tắt mà bạn có thể dùng trong trình biên tập này."
+
+msgctxt "Accessibility help dialog text displayed next to keystrokes that may require the Fn key on Mac."
+msgid "(may require <kbd>Fn</kbd>)"
+msgstr "(có thể cần nhấn phím <kbd>Fn</kbd>)"
+
+msgctxt "Accessibility help dialog title."
+msgid "Accessibility help"
+msgstr "Trợ giúp về khả năng truy cập"
+
+msgctxt "Assistive technologies label added to each editor editing area informing users about the possibility of opening the accessibility help dialog."
+msgid "Press %0 for help."
+msgstr "Nhấn %0 để được trợ giúp."
+
+msgctxt "Keystroke description for assistive technologies: keystroke for moving focus out of an active dialog window."
+msgid "Move focus in and out of an active dialog window"
+msgstr "Di chuyển tiêu điểm vào và ra khỏi cửa sổ hộp thoại đang kích hoạt"

package/lang/translations/zh-cn.po

@@ -144,3 +144,27 @@ msgstr "编辑器对话框"
 msgctxt "The label and the tooltip for the close button in the dialog header."
 msgid "Close"
 msgstr "关闭"
+
+msgctxt "Accessibility help dialog assistive technologies label telling users how to exit the dialog."
+msgid "Help Contents. To close this dialog press ESC."
+msgstr "帮助内容。要关闭此对话框，请按 ESC 键。"
+
+msgctxt "Accessibility help dialog text explaining what can be found in that dialog."
+msgid "Below, you can find a list of keyboard shortcuts that can be used in the editor."
+msgstr "您可以在下方找到可在编辑器中使用的键盘快捷键列表。"
+
+msgctxt "Accessibility help dialog text displayed next to keystrokes that may require the Fn key on Mac."
+msgid "(may require <kbd>Fn</kbd>)"
+msgstr "（可能需要用到 <kbd>Fn</kbd>键）"
+
+msgctxt "Accessibility help dialog title."
+msgid "Accessibility help"
+msgstr "无障碍辅助功能帮助"
+
+msgctxt "Assistive technologies label added to each editor editing area informing users about the possibility of opening the accessibility help dialog."
+msgid "Press %0 for help."
+msgstr "按 %0 获取帮助。"
+
+msgctxt "Keystroke description for assistive technologies: keystroke for moving focus out of an active dialog window."
+msgid "Move focus in and out of an active dialog window"
+msgstr "将焦点移入或移出活跃的对话框窗口"

package/lang/translations/zh.po

@@ -144,3 +144,27 @@ msgstr "編輯工具對話框"
 msgctxt "The label and the tooltip for the close button in the dialog header."
 msgid "Close"
 msgstr "關閉"
+
+msgctxt "Accessibility help dialog assistive technologies label telling users how to exit the dialog."
+msgid "Help Contents. To close this dialog press ESC."
+msgstr "協助內容。想關閉此對話框，請按 ESC 鍵。"
+
+msgctxt "Accessibility help dialog text explaining what can be found in that dialog."
+msgid "Below, you can find a list of keyboard shortcuts that can be used in the editor."
+msgstr "下方是可在編輯器中使用的鍵盤快捷鍵列表。"
+
+msgctxt "Accessibility help dialog text displayed next to keystrokes that may require the Fn key on Mac."
+msgid "(may require <kbd>Fn</kbd>)"
+msgstr "（可能需要 <kbd>Fn</kbd>）"
+
+msgctxt "Accessibility help dialog title."
+msgid "Accessibility help"
+msgstr "無障礙協助"
+
+msgctxt "Assistive technologies label added to each editor editing area informing users about the possibility of opening the accessibility help dialog."
+msgid "Press %0 for help."
+msgstr "按下 %0 來取得協助。"
+
+msgctxt "Keystroke description for assistive technologies: keystroke for moving focus out of an active dialog window."
+msgid "Move focus in and out of an active dialog window"
+msgstr "將焦點移入或移出啟用中的對話視窗"

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ckeditor/ckeditor5-ui",
-  "version": "41.1.0",
+  "version": "41.3.0-alpha.0",
   "description": "The UI framework and standard UI library of CKEditor 5.",
   "keywords": [
     "ckeditor",
@@ -12,8 +12,8 @@
   "type": "module",
   "main": "src/index.js",
   "dependencies": {
-    "@ckeditor/ckeditor5-core": "41.1.0",
-    "@ckeditor/ckeditor5-utils": "41.1.0",
+    "@ckeditor/ckeditor5-core": "41.3.0-alpha.0",
+    "@ckeditor/ckeditor5-utils": "41.3.0-alpha.0",
     "color-convert": "2.0.1",
     "color-parse": "1.4.2",
     "lodash-es": "4.17.21",
@@ -29,6 +29,7 @@
     "directory": "packages/ckeditor5-ui"
   },
   "files": [
+    "dist",
     "lang",
     "src/**/*.js",
     "src/**/*.d.ts",

package/src/augmentation.d.ts

@@ -2,7 +2,7 @@
  * @license Copyright (c) 2003-2024, CKSource Holding sp. z o.o. All rights reserved.
  * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
-import type { BalloonToolbar, BlockToolbar, ContextualBalloon, Notification, Dialog } from './index.js';
+import type { BalloonToolbar, BlockToolbar, ContextualBalloon, Notification, Dialog, AccessibilityHelp } from './index.js';
 import type { ToolbarConfig } from '@ckeditor/ckeditor5-core';
 declare module '@ckeditor/ckeditor5-core' {
     interface EditorConfig {
@@ -83,5 +83,6 @@ declare module '@ckeditor/ckeditor5-core' {
         [ContextualBalloon.pluginName]: ContextualBalloon;
         [Dialog.pluginName]: Dialog;
         [Notification.pluginName]: Notification;
+        [AccessibilityHelp.pluginName]: AccessibilityHelp;
     }
 }

package/src/colorpicker/colorpickerview.js

@@ -12,7 +12,6 @@ import View from '../view.js';
 import LabeledFieldView from '../labeledfield/labeledfieldview.js';
 import { createLabeledInputText } from '../labeledfield/utils.js';
 // Custom export due to https://github.com/ckeditor/ckeditor5/issues/15698.
-// eslint-disable-next-line ckeditor5-rules/require-file-extensions-in-imports
 import { HexBase } from 'vanilla-colorful/lib/entrypoints/hex';
 import '../../theme/components/colorpicker/colorpicker.css';
 const waitingTime = 150;

package/src/dialog/dialog.js

@@ -19,10 +19,20 @@ export default class Dialog extends Plugin {
      */
     constructor(editor) {
         super(editor);
+        const t = editor.t;
         this._initShowHideListeners();
         this._initFocusToggler();
         this._initMultiRootIntegration();
         this.set('id', null);
+        // Add the information about the keystroke to the accessibility database.
+        editor.accessibility.addKeystrokeInfos({
+            categoryId: 'navigation',
+            keystrokes: [{
+                    label: t('Move focus in and out of an active dialog window'),
+                    keystroke: 'Ctrl+F6',
+                    mayRequireFn: true
+                }]
+        });
     }
     /**
      * Initiates listeners for the `show` and `hide` events emitted by this plugin.

package/src/editorui/accessibilityhelp/accessibilityhelp.d.ts

@@ -0,0 +1,47 @@
+/**
+ * @license Copyright (c) 2003-2024, CKSource Holding sp. z o.o. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
+ */
+/**
+ * @module ui/editorui/accessibilityhelp/accessibilityhelp
+ */
+import { Plugin } from '@ckeditor/ckeditor5-core';
+import { Dialog } from '../../index.js';
+import AccessibilityHelpContentView from './accessibilityhelpcontentview.js';
+import '../../../theme/components/editorui/accessibilityhelp.css';
+/**
+ * A plugin that brings the accessibility help dialog to the editor available under the <kbd>Alt</kbd>+<kbd>0</kbd>
+ * keystroke and via the "Accessibility help" toolbar button. The dialog displays a list of keystrokes that can be used
+ * by the user to perform various actions in the editor.
+ *
+ * Keystroke information is loaded from {@link module:core/accessibility~Accessibility#keystrokeInfos}. New entries can be
+ * added using the API provided by the {@link module:core/accessibility~Accessibility} class.
+ */
+export default class AccessibilityHelp extends Plugin {
+    /**
+     * The view that displays the dialog content (list of keystrokes).
+     * Created when the dialog is opened for the first time.
+     */
+    contentView: AccessibilityHelpContentView | null;
+    /**
+     * @inheritDoc
+     */
+    static get requires(): readonly [typeof Dialog];
+    /**
+     * @inheritDoc
+     */
+    static get pluginName(): "AccessibilityHelp";
+    /**
+     * @inheritDoc
+     */
+    init(): void;
+    /**
+     * Injects a help text into each editing root's `aria-label` attribute allowing assistive technology users
+     * to discover the availability of the Accessibility help dialog.
+     */
+    private _setupRootLabels;
+    /**
+     * Shows the accessibility help dialog. Also, creates {@link #contentView} on demand.
+     */
+    private _showDialog;
+}

package/src/editorui/accessibilityhelp/accessibilityhelp.js

@@ -0,0 +1,111 @@
+/**
+ * @license Copyright (c) 2003-2024, CKSource Holding sp. z o.o. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
+ */
+/**
+ * @module ui/editorui/accessibilityhelp/accessibilityhelp
+ */
+import { Plugin } from '@ckeditor/ckeditor5-core';
+import { ButtonView, Dialog } from '../../index.js';
+import AccessibilityHelpContentView from './accessibilityhelpcontentview.js';
+import { getEnvKeystrokeText } from '@ckeditor/ckeditor5-utils';
+import accessibilityIcon from '../../../theme/icons/accessibility.svg';
+import '../../../theme/components/editorui/accessibilityhelp.css';
+/**
+ * A plugin that brings the accessibility help dialog to the editor available under the <kbd>Alt</kbd>+<kbd>0</kbd>
+ * keystroke and via the "Accessibility help" toolbar button. The dialog displays a list of keystrokes that can be used
+ * by the user to perform various actions in the editor.
+ *
+ * Keystroke information is loaded from {@link module:core/accessibility~Accessibility#keystrokeInfos}. New entries can be
+ * added using the API provided by the {@link module:core/accessibility~Accessibility} class.
+ */
+export default class AccessibilityHelp extends Plugin {
+    constructor() {
+        super(...arguments);
+        /**
+         * The view that displays the dialog content (list of keystrokes).
+         * Created when the dialog is opened for the first time.
+         */
+        this.contentView = null;
+    }
+    /**
+     * @inheritDoc
+     */
+    static get requires() {
+        return [Dialog];
+    }
+    /**
+     * @inheritDoc
+     */
+    static get pluginName() {
+        return 'AccessibilityHelp';
+    }
+    /**
+     * @inheritDoc
+     */
+    init() {
+        const editor = this.editor;
+        const t = editor.locale.t;
+        editor.ui.componentFactory.add('accessibilityHelp', locale => {
+            const buttonView = new ButtonView(locale);
+            buttonView.set({
+                label: t('Accessibility help'),
+                tooltip: true,
+                withText: false,
+                keystroke: 'Alt+0',
+                icon: accessibilityIcon
+            });
+            buttonView.on('execute', () => this._showDialog());
+            return buttonView;
+        });
+        editor.keystrokes.set('Alt+0', (evt, cancel) => {
+            this._showDialog();
+            cancel();
+        });
+        this._setupRootLabels();
+    }
+    /**
+     * Injects a help text into each editing root's `aria-label` attribute allowing assistive technology users
+     * to discover the availability of the Accessibility help dialog.
+     */
+    _setupRootLabels() {
+        const editor = this.editor;
+        const editingView = editor.editing.view;
+        const t = editor.t;
+        editor.ui.on('ready', () => {
+            editingView.change(writer => {
+                for (const root of editingView.document.roots) {
+                    addAriaLabelTextToRoot(writer, root);
+                }
+            });
+            editor.on('addRoot', (evt, modelRoot) => {
+                const viewRoot = editor.editing.view.document.getRoot(modelRoot.rootName);
+                editingView.change(writer => addAriaLabelTextToRoot(writer, viewRoot));
+            }, { priority: 'low' });
+        });
+        function addAriaLabelTextToRoot(writer, viewRoot) {
+            const currentAriaLabel = viewRoot.getAttribute('aria-label');
+            const newAriaLabel = `${currentAriaLabel}. ${t('Press %0 for help.', [getEnvKeystrokeText('Alt+0')])}`;
+            writer.setAttribute('aria-label', newAriaLabel, viewRoot);
+        }
+    }
+    /**
+     * Shows the accessibility help dialog. Also, creates {@link #contentView} on demand.
+     */
+    _showDialog() {
+        const editor = this.editor;
+        const dialog = editor.plugins.get('Dialog');
+        const t = editor.locale.t;
+        if (!this.contentView) {
+            this.contentView = new AccessibilityHelpContentView(editor.locale, editor.accessibility.keystrokeInfos);
+        }
+        dialog.show({
+            id: 'accessibilityHelp',
+            className: 'ck-accessibility-help-dialog',
+            title: t('Accessibility help'),
+            icon: accessibilityIcon,
+            hasCloseButton: true,
+            content: this.contentView
+        });
+    }
+}