@ckeditor/ckeditor5-bookmark 0.0.0-nightly-next-20250302.0 → 0.0.0-nightly-20250303.0

package/lang/contexts.json

@@ -1,5 +1,7 @@
 {
 	"Bookmark": "The label of the bookmark toolbar button. Also, a bookmark form header.",
+	"Insert": "The button in the bookmark insert form.",
+	"Update": "The button in the bookmark update form.",
 	"Edit bookmark": "Button opening the Bookmark editing balloon.",
 	"Remove bookmark": "Toolbar button tooltip for bookmark remove button.",
 	"Bookmark name": "The label of the input in the bookmark insert and update form. Also, the tooltip for the bookmark name in the bookmark preview.",
@@ -7,9 +9,5 @@
 	"Bookmark must not be empty.": "The error message. Displayed when the bookmark name is empty.",
 	"Bookmark name cannot contain space characters.": "The error message. Displayed when provided name includes spaces.",
 	"Bookmark name already exists.": "The error message. Displayed when provided name already exists.",
-	"bookmark widget": "The label for the bookmark widget.",
-	"Bookmark toolbar": "The label used by assistive technologies describing an bookmark toolbar attached to a bookmark widget.",
-	"Bookmarks": "Title for a feature displaying a list of bookmarks.",
-	"No bookmarks available.": "A message displayed instead of a list of bookmarks if it is empty.",
-	"Scroll to bookmark": "Tooltip shown after hovering the bookmark link preview."
+	"bookmark widget": "The label for the bookmark widget."
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ckeditor/ckeditor5-bookmark",
-  "version": "0.0.0-nightly-next-20250302.0",
+  "version": "0.0.0-nightly-20250303.0",
   "description": "Bookmark feature for CKEditor 5.",
   "keywords": [
     "ckeditor",
@@ -13,13 +13,12 @@
   "type": "module",
   "main": "src/index.js",
   "dependencies": {
-    "ckeditor5": "0.0.0-nightly-next-20250302.0",
-    "@ckeditor/ckeditor5-core": "0.0.0-nightly-next-20250302.0",
-    "@ckeditor/ckeditor5-icons": "0.0.0-nightly-next-20250302.0",
-    "@ckeditor/ckeditor5-widget": "0.0.0-nightly-next-20250302.0",
-    "@ckeditor/ckeditor5-utils": "0.0.0-nightly-next-20250302.0",
-    "@ckeditor/ckeditor5-ui": "0.0.0-nightly-next-20250302.0",
-    "@ckeditor/ckeditor5-link": "0.0.0-nightly-next-20250302.0"
+    "ckeditor5": "0.0.0-nightly-20250303.0",
+    "@ckeditor/ckeditor5-core": "0.0.0-nightly-20250303.0",
+    "@ckeditor/ckeditor5-engine": "0.0.0-nightly-20250303.0",
+    "@ckeditor/ckeditor5-widget": "0.0.0-nightly-20250303.0",
+    "@ckeditor/ckeditor5-utils": "0.0.0-nightly-20250303.0",
+    "@ckeditor/ckeditor5-ui": "0.0.0-nightly-20250303.0"
   },
   "author": "CKSource (http://cksource.com/)",
   "license": "SEE LICENSE IN LICENSE.md",

package/src/bookmarkconfig.d.ts

@@ -45,28 +45,4 @@ export interface BookmarkConfig {
      * @default true
      */
     enableNonEmptyAnchorConversion?: boolean;
-    /**
-     * Items to be placed in the bookmark contextual toolbar.
-     *
-     * Assuming that you use the {@link module:bookmark/bookmarkui~BookmarkUI} feature, the following toolbar items will be available
-     * in {@link module:ui/componentfactory~ComponentFactory}:
-     *
-     * * `'bookmarkPreview'`,
-     * * `'editBookmark'`,
-     * * `'removeBookmark'`.
-     *
-     * The default configuration for bookmark toolbar is:
-     *
-     * ```ts
-     * const bookmarkConfig = {
-     * 	toolbar: [ 'bookmarkPreview', '|', 'editBookmark', 'removeBookmark' ]
-     * };
-     * ```
-     *
-     * Of course, the same buttons can also be used in the
-     * {@link module:core/editor/editorconfig~EditorConfig#toolbar main editor toolbar}.
-     *
-     * Read more about configuring the toolbar in {@link module:core/editor/editorconfig~EditorConfig#toolbar}.
-     */
-    toolbar?: Array<string>;
 }

package/src/bookmarkediting.d.ts

@@ -5,7 +5,7 @@
 /**
  * @module bookmark/bookmarkediting
  */
-import { type Editor, Plugin } from 'ckeditor5/src/core.js';
+import { Plugin } from 'ckeditor5/src/core.js';
 import type { Element } from 'ckeditor5/src/engine.js';
 import '../theme/bookmark.css';
 /**
@@ -24,10 +24,6 @@ export default class BookmarkEditing extends Plugin {
      * @inheritDoc
      */
     static get isOfficialPlugin(): true;
-    /**
-     * @inheritDoc
-     */
-    constructor(editor: Editor);
     /**
      * @inheritDoc
      */
@@ -36,10 +32,6 @@ export default class BookmarkEditing extends Plugin {
      * Returns the model element for the given bookmark ID if it exists.
      */
     getElementForBookmarkId(bookmarkId: string): Element | null;
-    /**
-     * Returns all unique bookmark names existing in the content.
-     */
-    getAllBookmarkNames(): Set<string>;
     /**
      * Defines the schema for the bookmark feature.
      */

package/src/bookmarkediting.js

@@ -5,10 +5,9 @@
 /**
  * @module bookmark/bookmarkediting
  */
-import { Plugin } from 'ckeditor5/src/core.js';
+import { Plugin, icons } from 'ckeditor5/src/core.js';
 import { toWidget } from 'ckeditor5/src/widget.js';
 import { IconView } from 'ckeditor5/src/ui.js';
-import { IconBookmarkInline } from 'ckeditor5/src/icons.js';
 import InsertBookmarkCommand from './insertbookmarkcommand.js';
 import UpdateBookmarkCommand from './updatebookmarkcommand.js';
 import '../theme/bookmark.css';
@@ -16,10 +15,13 @@ import '../theme/bookmark.css';
  * The bookmark editing plugin.
  */
 export default class BookmarkEditing extends Plugin {
-    /**
-     * A collection of bookmarks elements in the document.
-     */
-    _bookmarkElements = new Map();
+    constructor() {
+        super(...arguments);
+        /**
+         * A collection of bookmarks elements in the document.
+         */
+        this._bookmarkElements = new Map();
+    }
     /**
      * @inheritDoc
      */
@@ -32,15 +34,6 @@ export default class BookmarkEditing extends Plugin {
     static get isOfficialPlugin() {
         return true;
     }
-    /**
-     * @inheritDoc
-     */
-    constructor(editor) {
-        super(editor);
-        editor.config.define('bookmark', {
-            toolbar: ['bookmarkPreview', '|', 'editBookmark', 'removeBookmark']
-        });
-    }
     /**
      * @inheritDoc
      */
@@ -65,12 +58,6 @@ export default class BookmarkEditing extends Plugin {
         }
         return null;
     }
-    /**
-     * Returns all unique bookmark names existing in the content.
-     */
-    getAllBookmarkNames() {
-        return new Set(this._bookmarkElements.values());
-    }
     /**
      * Defines the schema for the bookmark feature.
      */
@@ -116,7 +103,6 @@ export default class BookmarkEditing extends Plugin {
                     id,
                     class: 'ck-bookmark'
                 }, [this._createBookmarkUIElement(writer)]);
-                writer.setCustomProperty('bookmark', true, containerElement);
                 this._bookmarkElements.set(modelElement, id);
                 // `getFillerOffset` is not needed to set here, because `toWidget` has already covered it.
                 const labelCreator = () => `${id} ${t('bookmark widget')}`;
@@ -133,7 +119,7 @@ export default class BookmarkEditing extends Plugin {
             const domElement = this.toDomElement(domDocument);
             const icon = new IconView();
             icon.set({
-                content: IconBookmarkInline,
+                content: icons.bookmarkInline,
                 isColorInherited: false
             });
             icon.render();

package/src/bookmarkui.d.ts

@@ -2,12 +2,14 @@
  * @license Copyright (c) 2003-2025, CKSource Holding sp. z o.o. All rights reserved.
  * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
  */
+/**
+ * @module bookmark/bookmarkui
+ */
 import { Plugin } from 'ckeditor5/src/core.js';
 import { ContextualBalloon, type ViewWithCssTransitionDisabler } from 'ckeditor5/src/ui.js';
-import { WidgetToolbarRepository } from 'ckeditor5/src/widget.js';
 import BookmarkFormView from './ui/bookmarkformview.js';
+import BookmarkActionsView from './ui/bookmarkactionsview.js';
 import BookmarkEditing from './bookmarkediting.js';
-import '../theme/bookmarktoolbar.css';
 /**
  * The UI plugin of the bookmark feature.
  *
@@ -15,6 +17,10 @@ import '../theme/bookmarktoolbar.css';
  * which inserts the `bookmark` element upon selection.
  */
 export default class BookmarkUI extends Plugin {
+    /**
+     * The actions view displayed inside of the balloon.
+     */
+    actionsView: BookmarkActionsView | null;
     /**
      * The form view displayed inside the balloon.
      */
@@ -26,7 +32,7 @@ export default class BookmarkUI extends Plugin {
     /**
      * @inheritDoc
      */
-    static get requires(): readonly [typeof BookmarkEditing, typeof ContextualBalloon, typeof WidgetToolbarRepository];
+    static get requires(): readonly [typeof BookmarkEditing, typeof ContextualBalloon];
     /**
      * @inheritDoc
      */
@@ -39,10 +45,6 @@ export default class BookmarkUI extends Plugin {
      * @inheritDoc
      */
     init(): void;
-    /**
-     * @inheritDoc
-     */
-    afterInit(): void;
     /**
      * @inheritDoc
      */
@@ -52,53 +54,70 @@ export default class BookmarkUI extends Plugin {
      */
     private _createViews;
     /**
-     * Creates the {@link module:bookmark/ui/bookmarkformview~BookmarkFormView} instance.
+     * Creates the {@link module:bookmark/ui/bookmarkactionsview~BookmarkActionsView} instance.
      */
-    private _createFormView;
-    /**
-     * Creates link form menu list entry, so it'll be possible to access
-     * the list of the bookmarks from the link form.
-     */
-    private _registerLinkProvider;
+    private _createActionsView;
     /**
-     * Scrolls the editor to the bookmark with the given id.
+     * Creates the {@link module:bookmark/ui/bookmarkformview~BookmarkFormView} instance.
      */
-    private _scrollToBookmark;
+    private _createFormView;
     /**
      * Creates a toolbar Bookmark button. Clicking this button will show
      * a {@link #_balloon} attached to the selection.
      */
-    private _registerComponents;
+    private _createToolbarBookmarkButton;
     /**
      * Creates a button for `bookmark` command to use either in toolbar or in menu bar.
      */
-    private _createBookmarkButton;
+    private _createButton;
+    /**
+     * Attaches actions that control whether the balloon panel containing the
+     * {@link #formView} should be displayed.
+     */
+    private _enableBalloonActivators;
     /**
      * Attaches actions that control whether the balloon panel containing the
      * {@link #formView} is visible or not.
      */
     private _enableUserBalloonInteractions;
+    /**
+     * Updates the button label. If bookmark is selected label is set to 'Update' otherwise
+     * it is 'Insert'.
+     */
+    private _updateFormButtonLabel;
+    /**
+     * Adds the {@link #actionsView} to the {@link #_balloon}.
+     *
+     * @internal
+     */
+    _addActionsView(): void;
     /**
      * Adds the {@link #formView} to the {@link #_balloon}.
      */
     private _addFormView;
+    /**
+     * Closes the form view. Decides whether the balloon should be hidden completely.
+     */
+    private _closeFormView;
     /**
      * Removes the {@link #formView} from the {@link #_balloon}.
      */
     private _removeFormView;
     /**
-     * Shows the {@link #formView}.
+     * Shows the correct UI type. It is either {@link #formView} or {@link #actionsView}.
      */
-    private _showFormView;
+    private _showUI;
     /**
      * Removes the {@link #formView} from the {@link #_balloon}.
+     *
+     * See {@link #_addFormView}, {@link #_addActionsView}.
      */
-    private _hideFormView;
+    private _hideUI;
     /**
      * Makes the UI react to the {@link module:ui/editorui/editorui~EditorUI#event:update} event to
      * reposition itself when the editor UI should be refreshed.
      *
-     * See: {@link #_hideFormView} to learn when the UI stops reacting to the `update` event.
+     * See: {@link #_hideUI} to learn when the UI stops reacting to the `update` event.
      */
     private _startUpdatingUI;
     /**
@@ -106,9 +125,23 @@ export default class BookmarkUI extends Plugin {
      */
     private get _isFormInPanel();
     /**
-     * Returns `true` when {@link #formView} is in the {@link #_balloon} and it is currently visible.
+     * Returns `true` when {@link #actionsView} is in the {@link #_balloon}.
+     */
+    private get _areActionsInPanel();
+    /**
+     * Returns `true` when {@link #actionsView} is in the {@link #_balloon} and it is
+     * currently visible.
+     */
+    private get _areActionsVisible();
+    /**
+     * Returns `true` when {@link #actionsView} or {@link #formView} is in the {@link #_balloon}.
+     */
+    private get _isUIInPanel();
+    /**
+     * Returns `true` when {@link #actionsView} or {@link #formView} is in the {@link #_balloon} and it is
+     * currently visible.
      */
-    private get _isFormVisible();
+    private get _isUIVisible();
     /**
      * Returns positioning options for the {@link #_balloon}. They control the way the balloon is attached
      * to the target element or selection.