ckeditor5-elements-menu 0.0.0-stage → 49.0.0-alpha.4

package/dist/quickInsert/quickInsertListView.js

@@ -0,0 +1,44 @@
+import { ButtonView, ListItemView, ListView } from 'ckeditor5';
+/**
+ * A list of insertable elements that can be filtered by a search query.
+ *
+ * Fires `execute` with `{ value: name }` when an item is chosen.
+ */
+export default class QuickInsertListView extends ListView {
+    _entries;
+    constructor(locale, items) {
+        super(locale);
+        this.role = 'listbox';
+        this._entries = items.map(item => {
+            const view = new ListItemView(locale);
+            const button = new ButtonView(locale);
+            button.set({ label: item.label, withText: true, role: 'option' });
+            button.on('execute', () => {
+                this.fire('execute', { value: item.name });
+            });
+            view.children.add(button);
+            return { item, view, button };
+        });
+        this.items.addMany(this._entries.map(entry => entry.view));
+    }
+    /**
+     * Shows only the items whose label or name matches the expression. `null` shows all items.
+     */
+    filter(regExp) {
+        let resultsCount = 0;
+        for (const { item, view } of this._entries) {
+            view.isVisible = !regExp || regExp.test(item.label) || regExp.test(item.name);
+            if (view.isVisible) {
+                resultsCount++;
+            }
+        }
+        return { resultsCount, totalItemsCount: this._entries.length };
+    }
+    /**
+     * Returns the first item that is not filtered out.
+     */
+    getFirstVisibleItem() {
+        return this._entries.find(entry => entry.view.isVisible)?.item ?? null;
+    }
+}
+//# sourceMappingURL=quickInsertListView.js.map

package/dist/quickInsert/quickInsertListView.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"quickInsertListView.js","sourceRoot":"","sources":["../../src/quickInsert/quickInsertListView.ts"],"names":[],"mappings":"AAAA,OAAO,EACN,UAAU,EACV,YAAY,EACZ,QAAQ,EAIR,MAAM,WAAW,CAAC;AAUnB;;;;GAIG;AACH,MAAM,CAAC,OAAO,OAAO,mBAAoB,SAAQ,QAAQ;IACvC,QAAQ,CAAsE;IAE/F,YAAY,MAAc,EAAE,KAAiC;QAC5D,KAAK,CAAC,MAAM,CAAC,CAAC;QAEd,IAAI,CAAC,IAAI,GAAG,SAAS,CAAC;QAEtB,IAAI,CAAC,QAAQ,GAAG,KAAK,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE;YAChC,MAAM,IAAI,GAAG,IAAI,YAAY,CAAC,MAAM,CAAC,CAAC;YACtC,MAAM,MAAM,GAAG,IAAI,UAAU,CAAC,MAAM,CAAC,CAAC;YAEtC,MAAM,CAAC,GAAG,CAAC,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,QAAQ,EAAE,IAAI,EAAE,IAAI,EAAE,QAAQ,EAAE,CAAC,CAAC;YAClE,MAAM,CAAC,EAAE,CAAC,SAAS,EAAE,GAAG,EAAE;gBACzB,IAAI,CAAC,IAAI,CAA2B,SAAS,EAAE,EAAE,KAAK,EAAE,IAAI,CAAC,IAAI,EAAE,CAAC,CAAC;YACtE,CAAC,CAAC,CAAC;YAEH,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,MAAM,CAAC,CAAC;YAE1B,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;QAC/B,CAAC,CAAC,CAAC;QAEH,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC;IAC5D,CAAC;IAED;;OAEG;IACI,MAAM,CAAC,MAAqB;QAClC,IAAI,YAAY,GAAG,CAAC,CAAC;QAErB,KAAK,MAAM,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,IAAI,CAAC,QAAQ,EAAE,CAAC;YAC5C,IAAI,CAAC,SAAS,GAAG,CAAC,MAAM,IAAI,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;YAE9E,IAAI,IAAI,CAAC,SAAS,EAAE,CAAC;gBACpB,YAAY,EAAE,CAAC;YAChB,CAAC;QACF,CAAC;QAED,OAAO,EAAE,YAAY,EAAE,eAAe,EAAE,IAAI,CAAC,QAAQ,CAAC,MAAM,EAAE,CAAC;IAChE,CAAC;IAED;;OAEG;IACI,mBAAmB;QACzB,OAAO,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,EAAE,IAAI,IAAI,IAAI,CAAC;IACxE,CAAC;CACD"}

package/dist/quickInsert/quickInsertPositionCommand.d.ts

@@ -0,0 +1,28 @@
+import { type Editor } from 'ckeditor5';
+import { ElementOrPositionCommand, type ElementOrPosition } from 'ckeditor5-elements-core';
+/**
+ * Where the quick insert menu inserts, relative to the element.
+ */
+export type QuickInsertPlacement = 'before' | 'after';
+/**
+ * Opens the quick insert menu for the position before or after an element, next to that element.
+ *
+ * The element is the given one, the parent of the given position, or the selected element or the parent of the
+ * selection (see {@link ElementOrPositionCommand}). Enabled when something can be inserted at that position.
+ *
+ * Requires the `QuickInsert` plugin, which registers it as `quickInsertBefore` and `quickInsertAfter`.
+ */
+export default class QuickInsertPositionCommand extends ElementOrPositionCommand {
+    /**
+     * Where the quick insert menu inserts, relative to the element.
+     */
+    readonly placement: QuickInsertPlacement;
+    constructor(editor: Editor, placement: QuickInsertPlacement);
+    /**
+     * Opens the quick insert menu for the position before or after the element, next to the element.
+     */
+    execute(elementOrPosition?: ElementOrPosition): void;
+    protected _isEnabledFor(elementOrPosition?: ElementOrPosition): boolean;
+    private _getInsertPosition;
+}
+//# sourceMappingURL=quickInsertPositionCommand.d.ts.map

package/dist/quickInsert/quickInsertPositionCommand.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"quickInsertPositionCommand.d.ts","sourceRoot":"","sources":["../../src/quickInsert/quickInsertPositionCommand.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,MAAM,EAAsB,MAAM,WAAW,CAAC;AAC5D,OAAO,EAAE,wBAAwB,EAAE,KAAK,iBAAiB,EAAE,MAAM,yBAAyB,CAAC;AAG3F;;GAEG;AACH,MAAM,MAAM,oBAAoB,GAAG,QAAQ,GAAG,OAAO,CAAC;AAEtD;;;;;;;GAOG;AACH,MAAM,CAAC,OAAO,OAAO,0BAA2B,SAAQ,wBAAwB;IAC/E;;OAEG;IACH,SAAgB,SAAS,EAAE,oBAAoB,CAAC;gBAEpC,MAAM,EAAE,MAAM,EAAE,SAAS,EAAE,oBAAoB;IAQ3D;;OAEG;IACa,OAAO,CAAC,iBAAiB,CAAC,EAAE,iBAAiB,GAAG,IAAI;cAejD,aAAa,CAAC,iBAAiB,CAAC,EAAE,iBAAiB,GAAG,OAAO;IAYhF,OAAO,CAAC,kBAAkB;CAU1B"}

package/dist/quickInsert/quickInsertPositionCommand.js

@@ -0,0 +1,54 @@
+import {} from 'ckeditor5';
+import { ElementOrPositionCommand } from 'ckeditor5-elements-core';
+import { insertAfterIcon, insertBeforeIcon } from './icons.js';
+/**
+ * Opens the quick insert menu for the position before or after an element, next to that element.
+ *
+ * The element is the given one, the parent of the given position, or the selected element or the parent of the
+ * selection (see {@link ElementOrPositionCommand}). Enabled when something can be inserted at that position.
+ *
+ * Requires the `QuickInsert` plugin, which registers it as `quickInsertBefore` and `quickInsertAfter`.
+ */
+export default class QuickInsertPositionCommand extends ElementOrPositionCommand {
+    /**
+     * Where the quick insert menu inserts, relative to the element.
+     */
+    placement;
+    constructor(editor, placement) {
+        super(editor);
+        this.placement = placement;
+        this.title = placement === 'before' ? editor.t('Insert before') : editor.t('Insert after');
+        this.icon = placement === 'before' ? insertBeforeIcon : insertAfterIcon;
+    }
+    /**
+     * Opens the quick insert menu for the position before or after the element, next to the element.
+     */
+    execute(elementOrPosition) {
+        const editor = this.editor;
+        const element = this._getElement(elementOrPosition);
+        const position = this._getInsertPosition(elementOrPosition);
+        if (!element || !position) {
+            return;
+        }
+        const viewElement = editor.editing.mapper.toViewElement(element);
+        const domElement = viewElement && editor.editing.view.domConverter.mapViewToDom(viewElement);
+        editor.plugins.get('QuickInsert').open(position, domElement ?? undefined);
+    }
+    _isEnabledFor(elementOrPosition) {
+        const position = this._getInsertPosition(elementOrPosition);
+        const plugins = this.editor.plugins;
+        return (!!position &&
+            this.editor.model.canEditAt(position) &&
+            plugins.has('QuickInsert') &&
+            plugins.get('QuickInsert').getItems(position).length > 0);
+    }
+    _getInsertPosition(elementOrPosition) {
+        const element = this._getElement(elementOrPosition);
+        const model = this.editor.model;
+        if (!element) {
+            return null;
+        }
+        return this.placement === 'before' ? model.createPositionBefore(element) : model.createPositionAfter(element);
+    }
+}
+//# sourceMappingURL=quickInsertPositionCommand.js.map

package/dist/quickInsert/quickInsertPositionCommand.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"quickInsertPositionCommand.js","sourceRoot":"","sources":["../../src/quickInsert/quickInsertPositionCommand.ts"],"names":[],"mappings":"AAAA,OAAO,EAAmC,MAAM,WAAW,CAAC;AAC5D,OAAO,EAAE,wBAAwB,EAA0B,MAAM,yBAAyB,CAAC;AAC3F,OAAO,EAAE,eAAe,EAAE,gBAAgB,EAAE,MAAM,YAAY,CAAC;AAO/D;;;;;;;GAOG;AACH,MAAM,CAAC,OAAO,OAAO,0BAA2B,SAAQ,wBAAwB;IAC/E;;OAEG;IACa,SAAS,CAAuB;IAEhD,YAAY,MAAc,EAAE,SAA+B;QAC1D,KAAK,CAAC,MAAM,CAAC,CAAC;QAEd,IAAI,CAAC,SAAS,GAAG,SAAS,CAAC;QAC3B,IAAI,CAAC,KAAK,GAAG,SAAS,KAAK,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC;QAC3F,IAAI,CAAC,IAAI,GAAG,SAAS,KAAK,QAAQ,CAAC,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC,eAAe,CAAC;IACzE,CAAC;IAED;;OAEG;IACa,OAAO,CAAC,iBAAqC;QAC5D,MAAM,MAAM,GAAG,IAAI,CAAC,MAAM,CAAC;QAC3B,MAAM,OAAO,GAAG,IAAI,CAAC,WAAW,CAAC,iBAAiB,CAAC,CAAC;QACpD,MAAM,QAAQ,GAAG,IAAI,CAAC,kBAAkB,CAAC,iBAAiB,CAAC,CAAC;QAE5D,IAAI,CAAC,OAAO,IAAI,CAAC,QAAQ,EAAE,CAAC;YAC3B,OAAO;QACR,CAAC;QAED,MAAM,WAAW,GAAG,MAAM,CAAC,OAAO,CAAC,MAAM,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC;QACjE,MAAM,UAAU,GAAG,WAAW,IAAI,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,YAAY,CAAC,YAAY,CAAC,WAAW,CAAC,CAAC;QAE7F,MAAM,CAAC,OAAO,CAAC,GAAG,CAAC,aAAa,CAAC,CAAC,IAAI,CAAC,QAAQ,EAAE,UAAU,IAAI,SAAS,CAAC,CAAC;IAC3E,CAAC;IAEkB,aAAa,CAAC,iBAAqC;QACrE,MAAM,QAAQ,GAAG,IAAI,CAAC,kBAAkB,CAAC,iBAAiB,CAAC,CAAC;QAC5D,MAAM,OAAO,GAAG,IAAI,CAAC,MAAM,CAAC,OAAO,CAAC;QAEpC,OAAO,CACN,CAAC,CAAC,QAAQ;YACV,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC,SAAS,CAAC,QAAQ,CAAC;YACrC,OAAO,CAAC,GAAG,CAAC,aAAa,CAAC;YAC1B,OAAO,CAAC,GAAG,CAAC,aAAa,CAAC,CAAC,QAAQ,CAAC,QAAQ,CAAC,CAAC,MAAM,GAAG,CAAC,CACxD,CAAC;IACH,CAAC;IAEO,kBAAkB,CAAC,iBAAqC;QAC/D,MAAM,OAAO,GAAG,IAAI,CAAC,WAAW,CAAC,iBAAiB,CAAC,CAAC;QACpD,MAAM,KAAK,GAAG,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC;QAEhC,IAAI,CAAC,OAAO,EAAE,CAAC;YACd,OAAO,IAAI,CAAC;QACb,CAAC;QAED,OAAO,IAAI,CAAC,SAAS,KAAK,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,oBAAoB,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,mBAAmB,CAAC,OAAO,CAAC,CAAC;IAC/G,CAAC;CACD"}

package/dist/quickInsert/quickInsertView.d.ts

@@ -0,0 +1,20 @@
+import { SearchTextView, type Locale } from 'ckeditor5';
+import QuickInsertListView, { type QuickInsertItem } from './quickInsertListView.js';
+/**
+ * A search field with a filtered list of insertable elements.
+ *
+ * In the search field, Enter chooses the first matching item and the down arrow moves the focus to the list.
+ * Fires `execute` with `{ value: name }` when an item is chosen.
+ */
+export default class QuickInsertView extends SearchTextView {
+    /**
+     * The list of elements.
+     */
+    readonly listView: QuickInsertListView;
+    constructor(locale: Locale, items: readonly QuickInsertItem[]);
+    /**
+     * Renders the view and sets up Enter (choose the first match) and the down arrow (go to the list) in the search field.
+     */
+    render(): void;
+}
+//# sourceMappingURL=quickInsertView.d.ts.map

package/dist/quickInsert/quickInsertView.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"quickInsertView.d.ts","sourceRoot":"","sources":["../../src/quickInsert/quickInsertView.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAiC,KAAK,MAAM,EAAE,MAAM,WAAW,CAAC;AACvF,OAAO,mBAAmB,EAAE,EAAE,KAAK,eAAe,EAAE,MAAM,0BAA0B,CAAC;AAErF;;;;;GAKG;AACH,MAAM,CAAC,OAAO,OAAO,eAAgB,SAAQ,cAAc;IAC1D;;OAEG;IACH,SAAgB,QAAQ,EAAE,mBAAmB,CAAC;gBAElC,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,SAAS,eAAe,EAAE;IAoB7D;;OAEG;IACa,MAAM,IAAI,IAAI;CAyB9B"}

package/dist/quickInsert/quickInsertView.js

@@ -0,0 +1,52 @@
+import { SearchTextView } from 'ckeditor5';
+import QuickInsertListView, {} from './quickInsertListView.js';
+/**
+ * A search field with a filtered list of insertable elements.
+ *
+ * In the search field, Enter chooses the first matching item and the down arrow moves the focus to the list.
+ * Fires `execute` with `{ value: name }` when an item is chosen.
+ */
+export default class QuickInsertView extends SearchTextView {
+    /**
+     * The list of elements.
+     */
+    listView;
+    constructor(locale, items) {
+        const listView = new QuickInsertListView(locale, items);
+        const t = locale.t;
+        super(locale, {
+            queryView: { label: t('Insert element') },
+            filteredView: listView,
+            infoView: {
+                text: {
+                    notFound: { primary: t('No matching elements') },
+                    noSearchableItems: { primary: t('No elements can be inserted here') }
+                }
+            },
+            class: 'ck-elements-quick-insert'
+        });
+        this.listView = listView;
+        listView.delegate('execute').to(this);
+    }
+    /**
+     * Renders the view and sets up Enter (choose the first match) and the down arrow (go to the list) in the search field.
+     */
+    render() {
+        super.render();
+        const isInQueryField = () => this.focusTracker.focusedElement === this.queryView.element;
+        this.keystrokes.set('enter', (data, cancel) => {
+            const item = isInQueryField() ? this.listView.getFirstVisibleItem() : null;
+            if (item) {
+                this.fire('execute', { value: item.name });
+                cancel();
+            }
+        });
+        this.keystrokes.set('arrowdown', (data, cancel) => {
+            if (isInQueryField()) {
+                this.listView.focusFirst();
+                cancel();
+            }
+        }, { priority: 'high' });
+    }
+}
+//# sourceMappingURL=quickInsertView.js.map

package/dist/quickInsert/quickInsertView.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"quickInsertView.js","sourceRoot":"","sources":["../../src/quickInsert/quickInsertView.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAA8C,MAAM,WAAW,CAAC;AACvF,OAAO,mBAAmB,EAAE,EAAwB,MAAM,0BAA0B,CAAC;AAErF;;;;;GAKG;AACH,MAAM,CAAC,OAAO,OAAO,eAAgB,SAAQ,cAAc;IAC1D;;OAEG;IACa,QAAQ,CAAsB;IAE9C,YAAY,MAAc,EAAE,KAAiC;QAC5D,MAAM,QAAQ,GAAG,IAAI,mBAAmB,CAAC,MAAM,EAAE,KAAK,CAAC,CAAC;QACxD,MAAM,CAAC,GAAG,MAAM,CAAC,CAAC,CAAC;QAEnB,KAAK,CAAC,MAAM,EAAE;YACb,SAAS,EAAE,EAAE,KAAK,EAAE,CAAC,CAAC,gBAAgB,CAAC,EAAE;YACzC,YAAY,EAAE,QAAQ;YACtB,QAAQ,EAAE;gBACT,IAAI,EAAE;oBACL,QAAQ,EAAE,EAAE,OAAO,EAAE,CAAC,CAAC,sBAAsB,CAAC,EAAE;oBAChD,iBAAiB,EAAE,EAAE,OAAO,EAAE,CAAC,CAAC,kCAAkC,CAAC,EAAE;iBACrE;aACD;YACD,KAAK,EAAE,0BAA0B;SACjC,CAAC,CAAC;QAEH,IAAI,CAAC,QAAQ,GAAG,QAAQ,CAAC;QACzB,QAAQ,CAAC,QAAQ,CAAC,SAAS,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC;IACvC,CAAC;IAED;;OAEG;IACa,MAAM;QACrB,KAAK,CAAC,MAAM,EAAE,CAAC;QAEf,MAAM,cAAc,GAAG,GAAY,EAAE,CAAC,IAAI,CAAC,YAAY,CAAC,cAAc,KAAK,IAAI,CAAC,SAAS,CAAC,OAAO,CAAC;QAElG,IAAI,CAAC,UAAU,CAAC,GAAG,CAAC,OAAO,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,EAAE;YAC7C,MAAM,IAAI,GAAG,cAAc,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,QAAQ,CAAC,mBAAmB,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC;YAE3E,IAAI,IAAI,EAAE,CAAC;gBACV,IAAI,CAAC,IAAI,CAA2B,SAAS,EAAE,EAAE,KAAK,EAAE,IAAI,CAAC,IAAI,EAAE,CAAC,CAAC;gBACrE,MAAM,EAAE,CAAC;YACV,CAAC;QACF,CAAC,CAAC,CAAC;QAEH,IAAI,CAAC,UAAU,CAAC,GAAG,CAClB,WAAW,EACX,CAAC,IAAI,EAAE,MAAM,EAAE,EAAE;YAChB,IAAI,cAAc,EAAE,EAAE,CAAC;gBACtB,IAAI,CAAC,QAAQ,CAAC,UAAU,EAAE,CAAC;gBAC3B,MAAM,EAAE,CAAC;YACV,CAAC;QACF,CAAC,EACD,EAAE,QAAQ,EAAE,MAAM,EAAE,CACpB,CAAC;IACH,CAAC;CACD"}

package/package.json

@@ -1,6 +1,52 @@
 {
   "name": "ckeditor5-elements-menu",
-  "version": "0.0.0-stage",
-  "stub": true,
-  "description": "Temporary package placeholder for staged publishing"
+  "version": "49.0.0-alpha.4",
+  "description": "Element menus for CKEditor 5: the menu of an element, built from commands, and the element context menu, breadcrumbs and quick insert that open it.",
+  "keywords": [
+    "ckeditor",
+    "ckeditor5",
+    "ckeditor 5",
+    "ckeditor5-feature",
+    "ckeditor5-plugin"
+  ],
+  "license": "MIT",
+  "author": "Ivan Kildyushov",
+  "homepage": "https://ivankild.github.io/ckeditor5-elements/guide/context-menu",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/ivankild/ckeditor5-elements.git",
+    "directory": "packages/ckeditor5-elements-menu"
+  },
+  "bugs": {
+    "url": "https://github.com/ivankild/ckeditor5-elements/issues"
+  },
+  "type": "module",
+  "main": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js"
+    },
+    "./index.css": "./theme/menu.css",
+    "./package.json": "./package.json"
+  },
+  "files": [
+    "dist",
+    "src",
+    "theme",
+    "README.md"
+  ],
+  "sideEffects": [
+    "*.css"
+  ],
+  "dependencies": {
+    "ckeditor5-elements-core": "49.0.0-alpha.4"
+  },
+  "peerDependencies": {
+    "ckeditor5": "^49.0.0"
+  },
+  "scripts": {
+    "build": "tsc --build"
+  }
 }

package/src/augmentation.ts

@@ -0,0 +1,44 @@
+import type {
+	Breadcrumbs,
+	BreadcrumbsConfig,
+	ElementContextMenu,
+	ElementMenu,
+	ElementMenuConfig,
+	QuickInsert,
+	QuickInsertCommand,
+	QuickInsertConfig,
+	QuickInsertPositionCommand
+} from './index.js';
+
+declare module 'ckeditor5' {
+	interface PluginsMap {
+		[ElementMenu.pluginName]: ElementMenu;
+		[ElementContextMenu.pluginName]: ElementContextMenu;
+		[Breadcrumbs.pluginName]: Breadcrumbs;
+		[QuickInsert.pluginName]: QuickInsert;
+	}
+
+	interface CommandsMap {
+		quickInsert: QuickInsertCommand;
+		quickInsertBefore: QuickInsertPositionCommand;
+		quickInsertAfter: QuickInsertPositionCommand;
+	}
+
+	interface EditorConfig {
+		/**
+		 * Returns the items (commands, submenus and `'|'` separators) of the context menu of the right-clicked element.
+		 * See {@link ElementContextMenu}.
+		 */
+		elementContextMenu?: ElementMenuConfig;
+
+		/**
+		 * The configuration of the {@link Breadcrumbs} plugin.
+		 */
+		breadcrumbs?: BreadcrumbsConfig;
+
+		/**
+		 * The configuration of the {@link QuickInsert} plugin.
+		 */
+		quickInsert?: QuickInsertConfig;
+	}
+}

package/src/breadcrumbs/breadcrumbItemView.ts

@@ -0,0 +1,74 @@
+import { ButtonView, type Locale, type ModelElement, type ViewElement } from 'ckeditor5';
+
+/**
+ * A single breadcrumb that can be clicked: a button labelled with one element of the data view, e.g. `section.title`.
+ * It opens the menu of its element (`aria-haspopup`), and is `aria-expanded` while the menu is open.
+ */
+export default class BreadcrumbItemView extends ButtonView {
+	/**
+	 * The data view element this item stands for.
+	 */
+	public readonly viewElement: ViewElement;
+
+	/**
+	 * The model element the menu of this item is for.
+	 */
+	public readonly modelElement: ModelElement | null;
+
+	/**
+	 * Whether the menu of this item is open.
+	 *
+	 * @observable
+	 */
+	declare public isExpanded: boolean;
+
+	constructor(
+		locale: Locale | undefined,
+		{ label, viewElement, modelElement }: BreadcrumbItem,
+		{ isCurrent = false }: BreadcrumbItemViewOptions = {}
+	) {
+		super(locale);
+
+		this.viewElement = viewElement;
+		this.modelElement = modelElement;
+
+		this.set({ label, withText: true, isExpanded: false });
+
+		this.extendTemplate({
+			attributes: {
+				class: 'ck-elements-breadcrumbs__item',
+				'aria-haspopup': 'menu',
+				'aria-expanded': this.bindTemplate.to('isExpanded', value => String(value)),
+				...(isCurrent ? { 'aria-current': 'location' } : {})
+			}
+		});
+	}
+}
+
+/**
+ * The options of {@link BreadcrumbItemView} and {@link BreadcrumbLabelView}.
+ */
+export interface BreadcrumbItemViewOptions {
+	/**
+	 * Whether the item is the innermost element (where the cursor is). It is marked with `aria-current="location"`.
+	 */
+	isCurrent?: boolean;
+}
+
+/**
+ * A breadcrumb: an element of the data view, its label, and the model element it belongs to.
+ */
+export interface BreadcrumbItem {
+	label: string;
+
+	/**
+	 * The data view element (as in the editor data, e.g. `getData()`).
+	 */
+	viewElement: ViewElement;
+
+	/**
+	 * The model element of the view element: the mapped one, or for a part of a structure (e.g. a `tbody`), the closest
+	 * mapped ancestor (the table). `null` for list items (`ul`, `li`), which come from block attributes.
+	 */
+	modelElement: ModelElement | null;
+}

package/src/breadcrumbs/breadcrumbLabelView.ts

@@ -0,0 +1,55 @@
+import { View, type Locale, type ModelElement, type ViewElement } from 'ckeditor5';
+import { type BreadcrumbItem, type BreadcrumbItemViewOptions } from './breadcrumbItemView.js';
+
+/**
+ * A single breadcrumb that cannot be clicked: the label of one element of the data view, e.g. `section.title`.
+ *
+ * It can be focused (but is not in the Tab order), so keyboard users can reach it in a toolbar.
+ */
+export default class BreadcrumbLabelView extends View {
+	/**
+	 * The data view element this item stands for.
+	 */
+	public readonly viewElement: ViewElement;
+
+	/**
+	 * The model element of the view element, if any.
+	 */
+	public readonly modelElement: ModelElement | null;
+
+	/**
+	 * The label of the element.
+	 *
+	 * @observable
+	 */
+	declare public label: string;
+
+	constructor(
+		locale: Locale | undefined,
+		{ label, viewElement, modelElement }: BreadcrumbItem,
+		{ isCurrent = false }: BreadcrumbItemViewOptions = {}
+	) {
+		super(locale);
+
+		this.viewElement = viewElement;
+		this.modelElement = modelElement;
+		this.set('label', label);
+
+		this.setTemplate({
+			tag: 'span',
+			attributes: {
+				class: ['ck', 'ck-elements-breadcrumbs__item', 'ck-elements-breadcrumbs__label'],
+				tabindex: '-1',
+				...(isCurrent ? { 'aria-current': 'location' } : {})
+			},
+			children: [{ text: this.bindTemplate.to('label') }]
+		});
+	}
+
+	/**
+	 * Focuses the label.
+	 */
+	public focus(): void {
+		this.element?.focus();
+	}
+}