@ckeditor/ckeditor5-ui 40.2.0 → 41.1.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ckeditor/ckeditor5-ui",
-  "version": "40.2.0",
+  "version": "41.1.0",
   "description": "The UI framework and standard UI library of CKEditor 5.",
   "keywords": [
     "ckeditor",
@@ -9,10 +9,11 @@
     "ckeditor5-lib",
     "ckeditor5-dll"
   ],
+  "type": "module",
   "main": "src/index.js",
   "dependencies": {
-    "@ckeditor/ckeditor5-core": "40.2.0",
-    "@ckeditor/ckeditor5-utils": "40.2.0",
+    "@ckeditor/ckeditor5-core": "41.1.0",
+    "@ckeditor/ckeditor5-utils": "41.1.0",
     "color-convert": "2.0.1",
     "color-parse": "1.4.2",
     "lodash-es": "4.17.21",

package/src/arialiveannouncer.d.ts

@@ -1,5 +1,5 @@
 /**
- * @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
+ * @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
  */
 /**
@@ -7,18 +7,22 @@
  */
 import type { Editor } from '@ckeditor/ckeditor5-core';
 import type { Locale } from '@ckeditor/ckeditor5-utils';
-import type ViewCollection from './viewcollection';
-import View from './view';
+import type ViewCollection from './viewcollection.js';
+import View from './view.js';
 import '../theme/components/arialiveannouncer/arialiveannouncer.css';
 /**
  * The politeness level of an `aria-live` announcement.
  *
- * See https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Live_Regions#Politeness_levels
+ * Available keys are:
+ * * `AriaLiveAnnouncerPoliteness.POLITE`,
+ * * `AriaLiveAnnouncerPoliteness.ASSERTIVE`
+ *
+ * [Learn more](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Live_Regions#Politeness_levels).
  */
-export declare enum AriaLiveAnnouncerPoliteness {
-    POLITE = "polite",
-    ASSERTIVE = "assertive"
-}
+export declare const AriaLiveAnnouncerPoliteness: {
+    readonly POLITE: "polite";
+    readonly ASSERTIVE: "assertive";
+};
 /**
  * An accessibility helper that manages all ARIA live regions associated with an editor instance. ARIA live regions announce changes
  * to the state of the editor features.
@@ -62,7 +66,7 @@ export default class AriaLiveAnnouncer {
      * editor.ui.ariaLiveAnnouncer.announce( 'network', 'Connection lost. Reconnecting.' );
      * ```
      */
-    announce(regionName: string, announcementText: string, politeness?: AriaLiveAnnouncerPoliteness): void;
+    announce(regionName: string, announcementText: string, politeness?: typeof AriaLiveAnnouncerPoliteness[keyof typeof AriaLiveAnnouncerPoliteness]): void;
 }
 /**
  * The view that aggregates all `aria-live` regions.
@@ -85,7 +89,7 @@ export declare class AriaLiveAnnouncerRegionView extends View {
     /**
      * Current politeness level of the region.
      */
-    politeness: AriaLiveAnnouncerPoliteness;
+    politeness: typeof AriaLiveAnnouncerPoliteness[keyof typeof AriaLiveAnnouncerPoliteness];
     /**
      * A unique name of the region, usually associated with a specific editor feature or system.
      */

package/src/arialiveannouncer.js

@@ -1,19 +1,22 @@
 /**
- * @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
+ * @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 View from './view';
+import View from './view.js';
 import '../theme/components/arialiveannouncer/arialiveannouncer.css';
 /**
  * The politeness level of an `aria-live` announcement.
  *
- * See https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Live_Regions#Politeness_levels
+ * Available keys are:
+ * * `AriaLiveAnnouncerPoliteness.POLITE`,
+ * * `AriaLiveAnnouncerPoliteness.ASSERTIVE`
+ *
+ * [Learn more](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Live_Regions#Politeness_levels).
  */
-export var AriaLiveAnnouncerPoliteness;
-(function (AriaLiveAnnouncerPoliteness) {
-    AriaLiveAnnouncerPoliteness["POLITE"] = "polite";
-    AriaLiveAnnouncerPoliteness["ASSERTIVE"] = "assertive";
-})(AriaLiveAnnouncerPoliteness || (AriaLiveAnnouncerPoliteness = {}));
+export const AriaLiveAnnouncerPoliteness = {
+    POLITE: 'polite',
+    ASSERTIVE: 'assertive'
+};
 /**
  * An accessibility helper that manages all ARIA live regions associated with an editor instance. ARIA live regions announce changes
  * to the state of the editor features.

package/src/augmentation.d.ts

@@ -1,8 +1,8 @@
 /**
- * @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
+ * @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 } from './index';
+import type { BalloonToolbar, BlockToolbar, ContextualBalloon, Notification, Dialog } from './index.js';
 import type { ToolbarConfig } from '@ckeditor/ckeditor5-core';
 declare module '@ckeditor/ckeditor5-core' {
     interface EditorConfig {
@@ -81,6 +81,7 @@ declare module '@ckeditor/ckeditor5-core' {
         [BalloonToolbar.pluginName]: BalloonToolbar;
         [BlockToolbar.pluginName]: BlockToolbar;
         [ContextualBalloon.pluginName]: ContextualBalloon;
+        [Dialog.pluginName]: Dialog;
         [Notification.pluginName]: Notification;
     }
 }

package/src/augmentation.js

@@ -1,5 +1,5 @@
 /**
- * @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
+ * @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
  */
 export {};

package/src/autocomplete/autocompleteview.d.ts

@@ -1,14 +1,14 @@
 /**
- * @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
+ * @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/autocomplete/autocompleteview
 */
 import { type PositioningFunction, type Locale } from '@ckeditor/ckeditor5-utils';
-import SearchTextView, { type SearchTextViewConfig } from '../search/text/searchtextview';
-import type SearchResultsView from '../search/searchresultsview';
-import type InputBase from '../input/inputbase';
+import SearchTextView, { type SearchTextViewConfig } from '../search/text/searchtextview.js';
+import type SearchResultsView from '../search/searchresultsview.js';
+import type InputBase from '../input/inputbase.js';
 import '../../theme/components/autocomplete/autocomplete.css';
 /**
  * The autocomplete component's view class. It extends the {@link module:ui/search/text/searchtextview~SearchTextView} class

package/src/autocomplete/autocompleteview.js

@@ -1,19 +1,19 @@
 /**
- * @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
+ * @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/autocomplete/autocompleteview
 */
 import { getOptimalPosition, global, toUnit, Rect } from '@ckeditor/ckeditor5-utils';
-import SearchTextView from '../search/text/searchtextview';
+import SearchTextView from '../search/text/searchtextview.js';
 import '../../theme/components/autocomplete/autocomplete.css';
 /**
  * The autocomplete component's view class. It extends the {@link module:ui/search/text/searchtextview~SearchTextView} class
  * with a floating {@link #resultsView} that shows up when the user starts typing and hides when they blur
  * the component.
  */
-export default class AutocompleteView extends SearchTextView {
+class AutocompleteView extends SearchTextView {
     /**
      * @inheritDoc
      */
@@ -151,3 +151,4 @@ AutocompleteView.defaultResultsPositions = [
  * A function used to calculate the optimal position for the dropdown panel.
  */
 AutocompleteView._getOptimalPosition = getOptimalPosition;
+export default AutocompleteView;

package/src/bindings/addkeyboardhandlingforgrid.d.ts

@@ -1,12 +1,12 @@
 /**
- * @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
+ * @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/bindings/addkeyboardhandlingforgrid
  */
 import type { FocusTracker, KeystrokeHandler } from '@ckeditor/ckeditor5-utils';
-import type ViewCollection from '../viewcollection';
+import type ViewCollection from '../viewcollection.js';
 /**
  * A helper that adds a keyboard navigation support (arrow up/down/left/right) for grids.
  *

package/src/bindings/addkeyboardhandlingforgrid.js

@@ -1,5 +1,5 @@
 /**
- * @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
+ * @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
  */
 /**

package/src/bindings/clickoutsidehandler.d.ts

@@ -1,5 +1,5 @@
 /**
- * @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
+ * @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
  */
 /**

package/src/bindings/clickoutsidehandler.js

@@ -1,5 +1,5 @@
 /**
- * @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
+ * @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
  */
 /* global document */

package/src/bindings/csstransitiondisablermixin.d.ts

@@ -1,12 +1,12 @@
 /**
- * @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
+ * @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/bindings/csstransitiondisablermixin
  */
 import type { Constructor, Mixed } from '@ckeditor/ckeditor5-utils';
-import type View from '../view';
+import type View from '../view.js';
 /**
  * A mixin that brings the possibility to temporarily disable CSS transitions using
  * {@link module:ui/view~View} methods. It is helpful when, for instance, the transitions should not happen

package/src/bindings/csstransitiondisablermixin.js

@@ -1,5 +1,5 @@
 /**
- * @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
+ * @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
  */
 /**

package/src/bindings/draggableviewmixin.d.ts

@@ -0,0 +1,46 @@
+/**
+ * @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/bindings/draggableviewmixin
+ */
+import type View from '../view.js';
+import { type Constructor, type Mixed } from '@ckeditor/ckeditor5-utils';
+/**
+ * A mixin that brings the possibility to observe dragging of the view element.
+ * The view has to implement the {@link ~DraggableView} interface to use it:
+ *
+ * ```js
+ * export default class MyDraggableView extends DraggableViewMixin( View ) implements DraggableView {
+ * 		// ...
+ * }
+ * ```
+ *
+ * Creating a class extending it attaches a set of mouse and touch listeners allowing to observe dragging of the view element:
+ * * `mousedown` and `touchstart` on the view element - starting the dragging.
+ * * `mousemove` and `touchmove` on the document - updating the view coordinates.
+ * * `mouseup` and `touchend` on the document - stopping the dragging.
+ *
+ * The mixin itself does not provide a visual feedback (that is, the dragged element does not change its position) -
+ * it is up to the developer to implement it.
+ */
+export default function DraggableViewMixin<Base extends Constructor<View>>(view: Base): Mixed<Base, DraggableView>;
+/**
+ * An interface that should be implemented by views that want to be draggable.
+ */
+export interface DraggableView extends View {
+    get dragHandleElement(): HTMLElement | null;
+}
+/**
+ * An event data object for the {@link ~DraggableView} `drag` event. Fired when the view is dragged.
+ */
+export type DraggableViewDragEvent = {
+    name: 'drag';
+    args: [
+        {
+            deltaX: number;
+            deltaY: number;
+        }
+    ];
+};

package/src/bindings/draggableviewmixin.js

@@ -0,0 +1,144 @@
+/**
+ * @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 { global } from '@ckeditor/ckeditor5-utils';
+/**
+ * A mixin that brings the possibility to observe dragging of the view element.
+ * The view has to implement the {@link ~DraggableView} interface to use it:
+ *
+ * ```js
+ * export default class MyDraggableView extends DraggableViewMixin( View ) implements DraggableView {
+ * 		// ...
+ * }
+ * ```
+ *
+ * Creating a class extending it attaches a set of mouse and touch listeners allowing to observe dragging of the view element:
+ * * `mousedown` and `touchstart` on the view element - starting the dragging.
+ * * `mousemove` and `touchmove` on the document - updating the view coordinates.
+ * * `mouseup` and `touchend` on the document - stopping the dragging.
+ *
+ * The mixin itself does not provide a visual feedback (that is, the dragged element does not change its position) -
+ * it is up to the developer to implement it.
+ */
+export default function DraggableViewMixin(view) {
+    class DraggableMixin extends view {
+        /**
+         * @inheritdoc
+         */
+        constructor(...args) {
+            super(...args);
+            /**
+             * A bound version of {@link #_onDrag}.
+             */
+            this._onDragBound = this._onDrag.bind(this);
+            /**
+             * A bound version of {@link #_onDragEnd}.
+             */
+            this._onDragEndBound = this._onDragEnd.bind(this);
+            /**
+             * The last coordinates of the view. It is updated on every mouse move.
+             */
+            this._lastDraggingCoordinates = { x: 0, y: 0 };
+            this.on('render', () => {
+                this._attachListeners();
+            });
+            this.set('isDragging', false);
+        }
+        /**
+         * Attaches the listeners for the drag start.
+         */
+        _attachListeners() {
+            this.listenTo(this.element, 'mousedown', this._onDragStart.bind(this));
+            this.listenTo(this.element, 'touchstart', this._onDragStart.bind(this));
+        }
+        /**
+         * Attaches the listeners for the dragging and drag end.
+         */
+        _attachDragListeners() {
+            this.listenTo(global.document, 'mouseup', this._onDragEndBound);
+            this.listenTo(global.document, 'touchend', this._onDragEndBound);
+            this.listenTo(global.document, 'mousemove', this._onDragBound);
+            this.listenTo(global.document, 'touchmove', this._onDragBound);
+        }
+        /**
+         * Detaches the listeners after the drag end.
+         */
+        _detachDragListeners() {
+            this.stopListening(global.document, 'mouseup', this._onDragEndBound);
+            this.stopListening(global.document, 'touchend', this._onDragEndBound);
+            this.stopListening(global.document, 'mousemove', this._onDragBound);
+            this.stopListening(global.document, 'touchmove', this._onDragBound);
+        }
+        /**
+         * Starts the dragging listeners and sets the initial view coordinates.
+         */
+        _onDragStart(evt, domEvt) {
+            if (!this._isHandleElementPressed(domEvt)) {
+                return;
+            }
+            this._attachDragListeners();
+            let x = 0;
+            let y = 0;
+            // If dragging is performed with a mouse, there is only one set of coordinates available.
+            // But when using a touch device, there may be many of them, so use the coordinates from the first touch.
+            if (domEvt instanceof MouseEvent) {
+                x = domEvt.clientX;
+                y = domEvt.clientY;
+            }
+            else {
+                x = domEvt.touches[0].clientX;
+                y = domEvt.touches[0].clientY;
+            }
+            this._lastDraggingCoordinates = { x, y };
+            this.isDragging = true;
+        }
+        /**
+         * Updates the view coordinates and fires the `drag` event.
+         */
+        _onDrag(evt, domEvt) {
+            // If dragging was stopped by some external intervention, stop listening.
+            if (!this.isDragging) {
+                this._detachDragListeners();
+                return;
+            }
+            let newX = 0;
+            let newY = 0;
+            // If dragging is performed with a mouse, there is only one set of coordinates available.
+            // But when using a touch device, there may be many of them, so use the coordinates from the first touch.
+            if (domEvt instanceof MouseEvent) {
+                newX = domEvt.clientX;
+                newY = domEvt.clientY;
+            }
+            else {
+                newX = domEvt.touches[0].clientX;
+                newY = domEvt.touches[0].clientY;
+            }
+            // Prevents selection of text while dragging on Safari.
+            domEvt.preventDefault();
+            this.fire('drag', {
+                deltaX: Math.round(newX - this._lastDraggingCoordinates.x),
+                deltaY: Math.round(newY - this._lastDraggingCoordinates.y)
+            });
+            this._lastDraggingCoordinates = { x: newX, y: newY };
+        }
+        /**
+         * Stops the dragging and detaches the listeners.
+         */
+        _onDragEnd() {
+            this._detachDragListeners();
+            this.isDragging = false;
+        }
+        /**
+         * Checks if the drag handle element was pressed.
+         */
+        _isHandleElementPressed(domEvt) {
+            if (!this.dragHandleElement) {
+                return false;
+            }
+            return this.dragHandleElement === domEvt.target ||
+                (domEvt.target instanceof HTMLElement && this.dragHandleElement.contains(domEvt.target));
+        }
+    }
+    return DraggableMixin;
+}

package/src/bindings/injectcsstransitiondisabler.d.ts

@@ -1,11 +1,11 @@
 /**
- * @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
+ * @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/bindings/injectcsstransitiondisabler
  */
-import type View from '../view';
+import type View from '../view.js';
 /**
  * A decorator that brings the possibility to temporarily disable CSS transitions using
  * {@link module:ui/view~View} methods. It is helpful when, for instance, the transitions should not happen

package/src/bindings/injectcsstransitiondisabler.js

@@ -1,5 +1,5 @@
 /**
- * @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
+ * @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
  */
 /**

package/src/bindings/preventdefault.d.ts

@@ -1,12 +1,12 @@
 /**
- * @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
+ * @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/bindings/preventdefault
  */
-import type { ListenerBinding } from '../template';
-import type View from '../view';
+import type { ListenerBinding } from '../template.js';
+import type View from '../view.js';
 /**
  * A helper which executes a native `Event.preventDefault()` if the target of an event equals the
  * {@link module:ui/view~View#element element of the view}. It shortens the definition of a

package/src/bindings/preventdefault.js

@@ -1,5 +1,5 @@
 /**
- * @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
+ * @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
  */
 /**

package/src/bindings/submithandler.d.ts

@@ -1,11 +1,11 @@
 /**
- * @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
+ * @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/bindings/submithandler
  */
-import type View from '../view';
+import type View from '../view.js';
 /**
  * A handler useful for {@link module:ui/view~View views} working as HTML forms. It intercepts a native DOM
  * `submit` event, prevents the default web browser behavior (navigation and page reload) and

package/src/bindings/submithandler.js

@@ -1,5 +1,5 @@
 /**
- * @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
+ * @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
  */
 /**

package/src/button/button.d.ts

@@ -1,5 +1,5 @@
 /**
- * @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
+ * @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
  */
 /**
@@ -118,6 +118,9 @@ export default interface Button {
      * (Optional) An XML {@link module:ui/icon/iconview~IconView#content content} of the icon.
      * When defined, an `iconView` should be added to the button.
      *
+     * The user must provide the entire XML string, not just the path. See the
+     * {@glink framework/architecture/ui-library#setting-label-icon-and-tooltip UI library} guide for details.
+     *
      * @observable
      */
     icon: string | undefined;

package/src/button/button.js

@@ -1,5 +1,5 @@
 /**
- * @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
+ * @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
  */
 export {};

package/src/button/buttonlabel.d.ts

@@ -1,11 +1,11 @@
 /**
- * @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
+ * @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/button/buttonlabel
 */
-import type View from '../view';
+import type View from '../view.js';
 /**
  * The button label interface. Implemented by the {@link module:ui/button/buttonlabelview~ButtonLabelView}
  * and any label view that can be used with the {@link module:ui/button/buttonview~ButtonView}.

package/src/button/buttonlabel.js

@@ -1,5 +1,5 @@
 /**
- * @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
+ * @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
  */
 export {};

package/src/button/buttonlabelview.d.ts

@@ -1,12 +1,12 @@
 /**
- * @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
+ * @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/button/buttonlabelview
  */
-import View from '../view';
-import type ButtonLabel from './buttonlabel';
+import View from '../view.js';
+import type ButtonLabel from './buttonlabel.js';
 /**
  * A default implementation of the button view's label. It comes with a dynamic text support
  * via {@link module:ui/button/buttonlabelview~ButtonLabelView#text} property.

package/src/button/buttonlabelview.js

@@ -1,11 +1,11 @@
 /**
- * @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
+ * @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/button/buttonlabelview
  */
-import View from '../view';
+import View from '../view.js';
 /**
  * A default implementation of the button view's label. It comes with a dynamic text support
  * via {@link module:ui/button/buttonlabelview~ButtonLabelView#text} property.

package/src/button/buttonview.d.ts

@@ -1,15 +1,15 @@
 /**
- * @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
+ * @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/button/buttonview
  */
-import View from '../view';
-import IconView from '../icon/iconview';
-import type ViewCollection from '../viewcollection';
-import type { default as Button } from './button';
-import type ButtonLabel from './buttonlabel';
+import View from '../view.js';
+import IconView from '../icon/iconview.js';
+import type ViewCollection from '../viewcollection.js';
+import type { default as Button } from './button.js';
+import type ButtonLabel from './buttonlabel.js';
 import { type Locale } from '@ckeditor/ckeditor5-utils';
 import '../../theme/components/button/button.css';
 /**

package/src/button/buttonview.js

@@ -1,13 +1,13 @@
 /**
- * @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
+ * @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/button/buttonview
  */
-import View from '../view';
-import IconView from '../icon/iconview';
-import ButtonLabelView from './buttonlabelview';
+import View from '../view.js';
+import IconView from '../icon/iconview.js';
+import ButtonLabelView from './buttonlabelview.js';
 import { env, getEnvKeystrokeText, uid, delay } from '@ckeditor/ckeditor5-utils';
 import '../../theme/components/button/button.css';
 /**