@ckeditor/ckeditor5-image 45.2.1 → 46.0.0-alpha.1

package/src/imageresize/imageresizebuttons.js

@@ -6,10 +6,10 @@
  * @module image/imageresize/imageresizebuttons
  */
 import { Plugin } from 'ckeditor5/src/core.js';
-import { ButtonView, DropdownButtonView, ViewModel, createDropdown, addListToDropdown } from 'ckeditor5/src/ui.js';
+import { ButtonView, DropdownButtonView, UIModel, createDropdown, addListToDropdown } from 'ckeditor5/src/ui.js';
 import { CKEditorError, Collection } from 'ckeditor5/src/utils.js';
 import { IconObjectSizeCustom, IconObjectSizeFull, IconObjectSizeLarge, IconObjectSizeMedium, IconObjectSizeSmall } from 'ckeditor5/src/icons.js';
-import ImageResizeEditing from './imageresizeediting.js';
+import { ImageResizeEditing } from './imageresizeediting.js';
 const RESIZE_ICONS = /* #__PURE__ */ (() => ({
     small: IconObjectSizeSmall,
     medium: IconObjectSizeMedium,
@@ -22,7 +22,7 @@ const RESIZE_ICONS = /* #__PURE__ */ (() => ({
  *
  * It adds a possibility to resize images using the toolbar dropdown or individual buttons, depending on the plugin configuration.
  */
-export default class ImageResizeButtons extends Plugin {
+export class ImageResizeButtons extends Plugin {
     /**
      * @inheritDoc
      */
@@ -241,7 +241,7 @@ export default class ImageResizeButtons extends Plugin {
                 const customResizeUI = editor.plugins.get('ImageCustomResizeUI');
                 definition = {
                     type: 'button',
-                    model: new ViewModel({
+                    model: new UIModel({
                         label: this._getOptionLabelValue(option),
                         role: 'menuitemradio',
                         withText: true,
@@ -257,7 +257,7 @@ export default class ImageResizeButtons extends Plugin {
             else {
                 definition = {
                     type: 'button',
-                    model: new ViewModel({
+                    model: new UIModel({
                         commandName: 'resizeImage',
                         commandValue: option.valueWithUnits,
                         label: this._getOptionLabelValue(option),

package/src/imageresize/imageresizeediting.d.ts

@@ -3,14 +3,14 @@
  * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
  */
 import { type Editor, Plugin } from 'ckeditor5/src/core.js';
-import ImageUtils from '../imageutils.js';
+import { ImageUtils } from '../imageutils.js';
 /**
  * The image resize editing feature.
  *
  * It adds the ability to resize each image using handles or manually by
  * {@link module:image/imageresize/imageresizebuttons~ImageResizeButtons} buttons.
  */
-export default class ImageResizeEditing extends Plugin {
+export declare class ImageResizeEditing extends Plugin {
     /**
      * @inheritDoc
      */

package/src/imageresize/imageresizeediting.js

@@ -3,8 +3,8 @@
  * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
  */
 import { Plugin } from 'ckeditor5/src/core.js';
-import ImageUtils from '../imageutils.js';
-import ResizeImageCommand from './resizeimagecommand.js';
+import { ImageUtils } from '../imageutils.js';
+import { ResizeImageCommand } from './resizeimagecommand.js';
 import { widthAndHeightStylesAreBothSet } from '../image/utils.js';
 /**
  * The image resize editing feature.
@@ -12,7 +12,7 @@ import { widthAndHeightStylesAreBothSet } from '../image/utils.js';
  * It adds the ability to resize each image using handles or manually by
  * {@link module:image/imageresize/imageresizebuttons~ImageResizeButtons} buttons.
  */
-export default class ImageResizeEditing extends Plugin {
+export class ImageResizeEditing extends Plugin {
     /**
      * @inheritDoc
      */
@@ -86,11 +86,16 @@ export default class ImageResizeEditing extends Plugin {
         this._registerSchema();
     }
     _registerSchema() {
+        const schema = this.editor.model.schema;
         if (this.editor.plugins.has('ImageBlockEditing')) {
-            this.editor.model.schema.extend('imageBlock', { allowAttributes: ['resizedWidth', 'resizedHeight'] });
+            schema.extend('imageBlock', { allowAttributes: ['resizedWidth', 'resizedHeight'] });
+            schema.setAttributeProperties('resizedWidth', { isFormatting: true });
+            schema.setAttributeProperties('resizedHeight', { isFormatting: true });
         }
         if (this.editor.plugins.has('ImageInlineEditing')) {
-            this.editor.model.schema.extend('imageInline', { allowAttributes: ['resizedWidth', 'resizedHeight'] });
+            schema.extend('imageInline', { allowAttributes: ['resizedWidth', 'resizedHeight'] });
+            schema.setAttributeProperties('resizedWidth', { isFormatting: true });
+            schema.setAttributeProperties('resizedHeight', { isFormatting: true });
         }
     }
     /**

package/src/imageresize/imageresizehandles.d.ts

@@ -4,14 +4,14 @@
  */
 import { Plugin } from 'ckeditor5/src/core.js';
 import { WidgetResize } from 'ckeditor5/src/widget.js';
-import ImageUtils from '../imageutils.js';
+import { ImageUtils } from '../imageutils.js';
 /**
  * The image resize by handles feature.
  *
  * It adds the ability to resize each image using handles or manually by
  * {@link module:image/imageresize/imageresizebuttons~ImageResizeButtons} buttons.
  */
-export default class ImageResizeHandles extends Plugin {
+export declare class ImageResizeHandles extends Plugin {
     /**
      * @inheritDoc
      */

package/src/imageresize/imageresizehandles.js

@@ -4,8 +4,8 @@
  */
 import { Plugin } from 'ckeditor5/src/core.js';
 import { WidgetResize } from 'ckeditor5/src/widget.js';
-import ImageUtils from '../imageutils.js';
-import ImageLoadObserver from '../image/imageloadobserver.js';
+import { ImageUtils } from '../imageutils.js';
+import { ImageLoadObserver } from '../image/imageloadobserver.js';
 const RESIZABLE_IMAGES_CSS_SELECTOR = 'figure.image.ck-widget > img,' +
     'figure.image.ck-widget > picture > img,' +
     'figure.image.ck-widget > a > img,' +
@@ -19,7 +19,7 @@ const RESIZED_IMAGE_CLASS = 'image_resized';
  * It adds the ability to resize each image using handles or manually by
  * {@link module:image/imageresize/imageresizebuttons~ImageResizeButtons} buttons.
  */
-export default class ImageResizeHandles extends Plugin {
+export class ImageResizeHandles extends Plugin {
     /**
      * @inheritDoc
      */

package/src/imageresize/resizeimagecommand.d.ts

@@ -9,7 +9,7 @@ import { Command } from 'ckeditor5/src/core.js';
 /**
  * The resize image command. Currently, it only supports the width attribute.
  */
-export default class ResizeImageCommand extends Command {
+export declare class ResizeImageCommand extends Command {
     /**
      * Desired image width and height.
      */

package/src/imageresize/resizeimagecommand.js

@@ -9,7 +9,7 @@ import { Command } from 'ckeditor5/src/core.js';
 /**
  * The resize image command. Currently, it only supports the width attribute.
  */
-export default class ResizeImageCommand extends Command {
+export class ResizeImageCommand extends Command {
     /**
      * @inheritDoc
      */

package/src/imageresize/ui/imagecustomresizeformview.d.ts

@@ -12,8 +12,10 @@ import '@ckeditor/ckeditor5-ui/theme/components/responsive-form/responsiveform.c
 import '@ckeditor/ckeditor5-ui/theme/components/form/form.css';
 /**
  * The ImageCustomResizeFormView class.
+ *
+ * @internal
  */
-export default class ImageCustomResizeFormView extends View {
+export declare class ImageCustomResizeFormView extends View {
     /**
      * Tracks information about the DOM focus in the form.
      */
@@ -114,6 +116,8 @@ export default class ImageCustomResizeFormView extends View {
  *
  * 	* If `undefined` is returned, it is assumed that the form value is correct and there is no error.
  * 	* If string is returned, it is assumed that the form value is incorrect and the returned string is displayed in the error label
+ *
+ * @internal
  */
 export type ImageCustomResizeFormValidatorCallback = (form: ImageCustomResizeFormView) => string | undefined;
 /**

package/src/imageresize/ui/imagecustomresizeformview.js

@@ -16,8 +16,10 @@ import '@ckeditor/ckeditor5-ui/theme/components/responsive-form/responsiveform.c
 import '@ckeditor/ckeditor5-ui/theme/components/form/form.css';
 /**
  * The ImageCustomResizeFormView class.
+ *
+ * @internal
  */
-export default class ImageCustomResizeFormView extends View {
+export class ImageCustomResizeFormView extends View {
     /**
      * Tracks information about the DOM focus in the form.
      */

package/src/imageresize/utils/getselectedimageeditornodes.d.ts

@@ -5,19 +5,20 @@
 /**
  * @module image/imageresize/utils/getselectedimageeditornodes
  */
-import type { ViewElement, Element } from 'ckeditor5/src/engine.js';
+import type { ViewElement, ModelElement } from 'ckeditor5/src/engine.js';
 import type { Editor } from 'ckeditor5/src/core.js';
 /**
  * Finds model, view and DOM element for selected image element. Returns `null` if there is no image selected.
  *
  * @param editor Editor instance.
+ * @internal
  */
 export declare function getSelectedImageEditorNodes(editor: Editor): ImageEditorNodes | null;
 /**
  * @internal;
  */
 type ImageEditorNodes = {
-    model: Element;
+    model: ModelElement;
     view: ViewElement;
     dom: HTMLElement;
 };

package/src/imageresize/utils/getselectedimageeditornodes.js

@@ -6,6 +6,7 @@
  * Finds model, view and DOM element for selected image element. Returns `null` if there is no image selected.
  *
  * @param editor Editor instance.
+ * @internal
  */
 export function getSelectedImageEditorNodes(editor) {
     const { editing } = editor;

package/src/imageresize/utils/getselectedimagepossibleresizerange.d.ts

@@ -12,6 +12,7 @@ import type { Editor } from 'ckeditor5/src/core.js';
  * @param editor Editor instance.
  * @param targetUnit Unit in which dimension will be returned.
  * @returns Possible resize range in numeric form.
+ * @internal
  */
 export declare function getSelectedImagePossibleResizeRange(editor: Editor, targetUnit: string): PossibleResizeImageRange | null;
 /**

package/src/imageresize/utils/getselectedimagepossibleresizerange.js

@@ -11,6 +11,7 @@ import { tryCastDimensionsToUnit, tryParseDimensionWithUnit } from './tryparsedi
  * @param editor Editor instance.
  * @param targetUnit Unit in which dimension will be returned.
  * @returns Possible resize range in numeric form.
+ * @internal
  */
 export function getSelectedImagePossibleResizeRange(editor, targetUnit) {
     const imageNodes = getSelectedImageEditorNodes(editor);

package/src/imageresize/utils/getselectedimagewidthinunits.d.ts

@@ -14,5 +14,6 @@ import { type DimensionWithUnit } from './tryparsedimensionwithunit.js';
  * @param editor Editor instance.
  * @param targetUnit Unit in which dimension will be returned.
  * @returns Parsed image width after resize (with unit).
+ * @internal
  */
 export declare function getSelectedImageWidthInUnits(editor: Editor, targetUnit: string): DimensionWithUnit | null;

package/src/imageresize/utils/getselectedimagewidthinunits.js

@@ -19,6 +19,7 @@ import { getSelectedImageEditorNodes } from './getselectedimageeditornodes.js';
  * @param editor Editor instance.
  * @param targetUnit Unit in which dimension will be returned.
  * @returns Parsed image width after resize (with unit).
+ * @internal
  */
 export function getSelectedImageWidthInUnits(editor, targetUnit) {
     const imageNodes = getSelectedImageEditorNodes(editor);

package/src/imageresize/utils/tryparsedimensionwithunit.d.ts

@@ -18,6 +18,7 @@
 
  * @param dimension Unsafe string with dimension.
  * @returns Parsed dimension with extracted numeric value and units.
+ * @internal
  */
 export declare function tryParseDimensionWithUnit(dimension: string | null | undefined): DimensionWithUnit | null;
 /**
@@ -26,6 +27,7 @@ export declare function tryParseDimensionWithUnit(dimension: string | null | und
  * @param parentDimensionPx	Dimension of parent element that contains measured element.
  * @param dimension Measured element dimension.
  * @returns Casted dimension.
+ * @internal
  */
 export declare function tryCastDimensionsToUnit(parentDimensionPx: number, dimension: DimensionWithUnit, targetUnit: string): DimensionWithUnit;
 /**

package/src/imageresize/utils/tryparsedimensionwithunit.js

@@ -18,6 +18,7 @@
 
  * @param dimension Unsafe string with dimension.
  * @returns Parsed dimension with extracted numeric value and units.
+ * @internal
  */
 export function tryParseDimensionWithUnit(dimension) {
     if (!dimension) {
@@ -39,6 +40,7 @@ export function tryParseDimensionWithUnit(dimension) {
  * @param parentDimensionPx	Dimension of parent element that contains measured element.
  * @param dimension Measured element dimension.
  * @returns Casted dimension.
+ * @internal
  */
 export function tryCastDimensionsToUnit(parentDimensionPx, dimension, targetUnit) {
     // "%" -> "px" conversion

package/src/imageresize.d.ts

@@ -6,17 +6,17 @@
  * @module image/imageresize
  */
 import { Plugin } from 'ckeditor5/src/core.js';
-import ImageResizeButtons from './imageresize/imageresizebuttons.js';
-import ImageResizeEditing from './imageresize/imageresizeediting.js';
-import ImageResizeHandles from './imageresize/imageresizehandles.js';
-import ImageCustomResizeUI from './imageresize/imagecustomresizeui.js';
+import { ImageResizeButtons } from './imageresize/imageresizebuttons.js';
+import { ImageResizeEditing } from './imageresize/imageresizeediting.js';
+import { ImageResizeHandles } from './imageresize/imageresizehandles.js';
+import { ImageCustomResizeUI } from './imageresize/imagecustomresizeui.js';
 import '../theme/imageresize.css';
 /**
  * The image resize plugin.
  *
  * It adds a possibility to resize each image using handles.
  */
-export default class ImageResize extends Plugin {
+export declare class ImageResize extends Plugin {
     /**
      * @inheritDoc
      */

package/src/imageresize.js

@@ -6,17 +6,17 @@
  * @module image/imageresize
  */
 import { Plugin } from 'ckeditor5/src/core.js';
-import ImageResizeButtons from './imageresize/imageresizebuttons.js';
-import ImageResizeEditing from './imageresize/imageresizeediting.js';
-import ImageResizeHandles from './imageresize/imageresizehandles.js';
-import ImageCustomResizeUI from './imageresize/imagecustomresizeui.js';
+import { ImageResizeButtons } from './imageresize/imageresizebuttons.js';
+import { ImageResizeEditing } from './imageresize/imageresizeediting.js';
+import { ImageResizeHandles } from './imageresize/imageresizehandles.js';
+import { ImageCustomResizeUI } from './imageresize/imagecustomresizeui.js';
 import '../theme/imageresize.css';
 /**
  * The image resize plugin.
  *
  * It adds a possibility to resize each image using handles.
  */
-export default class ImageResize extends Plugin {
+export class ImageResize extends Plugin {
     /**
      * @inheritDoc
      */

package/src/imagesizeattributes.d.ts

@@ -6,11 +6,11 @@
  * @module image/imagesizeattributes
  */
 import { Plugin } from 'ckeditor5/src/core.js';
-import ImageUtils from './imageutils.js';
+import { ImageUtils } from './imageutils.js';
 /**
  * This plugin enables `width` and `height` attributes in inline and block image elements.
  */
-export default class ImageSizeAttributes extends Plugin {
+export declare class ImageSizeAttributes extends Plugin {
     /**
      * @inheritDoc
      */

package/src/imagesizeattributes.js

@@ -6,12 +6,12 @@
  * @module image/imagesizeattributes
  */
 import { Plugin } from 'ckeditor5/src/core.js';
-import ImageUtils from './imageutils.js';
+import { ImageUtils } from './imageutils.js';
 import { widthAndHeightStylesAreBothSet, getSizeValueIfInPx } from './image/utils.js';
 /**
  * This plugin enables `width` and `height` attributes in inline and block image elements.
  */
-export default class ImageSizeAttributes extends Plugin {
+export class ImageSizeAttributes extends Plugin {
     /**
      * @inheritDoc
      */
@@ -42,11 +42,12 @@ export default class ImageSizeAttributes extends Plugin {
      * Registers the `width` and `height` attributes for inline and block images.
      */
     _registerSchema() {
+        const schema = this.editor.model.schema;
         if (this.editor.plugins.has('ImageBlockEditing')) {
-            this.editor.model.schema.extend('imageBlock', { allowAttributes: ['width', 'height'] });
+            schema.extend('imageBlock', { allowAttributes: ['width', 'height'] });
         }
         if (this.editor.plugins.has('ImageInlineEditing')) {
-            this.editor.model.schema.extend('imageInline', { allowAttributes: ['width', 'height'] });
+            schema.extend('imageInline', { allowAttributes: ['width', 'height'] });
         }
     }
     /**

package/src/imagestyle/converters.d.ts

@@ -13,6 +13,7 @@ import type { ImageStyleOptionDefinition } from '../imageconfig.js';
  *
  * @param styles An array containing available image style options.
  * @returns A model-to-view attribute converter.
+ * @internal
  */
 export declare function modelToViewStyleAttribute(styles: Array<ImageStyleOptionDefinition>): GetCallback<DowncastAttributeEvent>;
 /**
@@ -20,5 +21,6 @@ export declare function modelToViewStyleAttribute(styles: Array<ImageStyleOption
  *
  * @param styles Image style options for which the converter is created.
  * @returns A view-to-model converter.
+ * @internal
  */
 export declare function viewToModelStyleAttribute(styles: Array<ImageStyleOptionDefinition>): GetCallback<UpcastElementEvent>;

package/src/imagestyle/converters.js

@@ -11,6 +11,7 @@ import { first } from 'ckeditor5/src/utils.js';
  *
  * @param styles An array containing available image style options.
  * @returns A model-to-view attribute converter.
+ * @internal
  */
 export function modelToViewStyleAttribute(styles) {
     return (evt, data, conversionApi) => {
@@ -35,6 +36,7 @@ export function modelToViewStyleAttribute(styles) {
  *
  * @param styles Image style options for which the converter is created.
  * @returns A view-to-model converter.
+ * @internal
  */
 export function viewToModelStyleAttribute(styles) {
     // Convert only non–default styles.

package/src/imagestyle/imagestylecommand.d.ts

@@ -5,7 +5,7 @@
 /**
  * @module image/imagestyle/imagestylecommand
  */
-import type { Element } from 'ckeditor5/src/engine.js';
+import type { ModelElement } from 'ckeditor5/src/engine.js';
 import { Command, type Editor } from 'ckeditor5/src/core.js';
 import type { ImageStyleOptionDefinition } from '../imageconfig.js';
 /**
@@ -15,7 +15,7 @@ import type { ImageStyleOptionDefinition } from '../imageconfig.js';
  * **Note**: Executing this command may change the image model element if the desired style requires an image of a different
  * type. See {@link module:image/imagestyle/imagestylecommand~ImageStyleCommand#execute} to learn more.
  */
-export default class ImageStyleCommand extends Command {
+export declare class ImageStyleCommand extends Command {
     /**
      * An object containing names of default style options for the inline and block images.
      * If there is no default style option for the given image type in the configuration,
@@ -64,5 +64,5 @@ export default class ImageStyleCommand extends Command {
      * @param requestedStyle The name of the style (as configured in {@link module:image/imageconfig~ImageStyleConfig#options}).
      * @param imageElement The image model element.
      */
-    shouldConvertImageType(requestedStyle: string, imageElement: Element): boolean;
+    shouldConvertImageType(requestedStyle: string, imageElement: ModelElement): boolean;
 }

package/src/imagestyle/imagestylecommand.js

@@ -10,7 +10,7 @@ import { Command } from 'ckeditor5/src/core.js';
  * **Note**: Executing this command may change the image model element if the desired style requires an image of a different
  * type. See {@link module:image/imagestyle/imagestylecommand~ImageStyleCommand#execute} to learn more.
  */
-export default class ImageStyleCommand extends Command {
+export class ImageStyleCommand extends Command {
     /**
      * An object containing names of default style options for the inline and block images.
      * If there is no default style option for the given image type in the configuration,

package/src/imagestyle/imagestyleediting.d.ts

@@ -6,13 +6,13 @@
  * @module image/imagestyle/imagestyleediting
  */
 import { Plugin } from 'ckeditor5/src/core.js';
-import ImageUtils from '../imageutils.js';
+import { ImageUtils } from '../imageutils.js';
 import type { ImageStyleOptionDefinition } from '../imageconfig.js';
 /**
  * The image style engine plugin. It sets the default configuration, creates converters and registers
  * {@link module:image/imagestyle/imagestylecommand~ImageStyleCommand ImageStyleCommand}.
  */
-export default class ImageStyleEditing extends Plugin {
+export declare class ImageStyleEditing extends Plugin {
     /**
      * @inheritDoc
      */

package/src/imagestyle/imagestyleediting.js

@@ -6,15 +6,15 @@
  * @module image/imagestyle/imagestyleediting
  */
 import { Plugin } from 'ckeditor5/src/core.js';
-import ImageStyleCommand from './imagestylecommand.js';
-import ImageUtils from '../imageutils.js';
-import utils from './utils.js';
+import { ImageStyleCommand } from './imagestylecommand.js';
+import { ImageUtils } from '../imageutils.js';
+import { utils } from './utils.js';
 import { viewToModelStyleAttribute, modelToViewStyleAttribute } from './converters.js';
 /**
  * The image style engine plugin. It sets the default configuration, creates converters and registers
  * {@link module:image/imagestyle/imagestylecommand~ImageStyleCommand ImageStyleCommand}.
  */
-export default class ImageStyleEditing extends Plugin {
+export class ImageStyleEditing extends Plugin {
     /**
      * @inheritDoc
      */
@@ -49,12 +49,11 @@ export default class ImageStyleEditing extends Plugin {
      * @inheritDoc
      */
     init() {
-        const { normalizeStyles, getDefaultStylesConfiguration } = utils;
         const editor = this.editor;
         const isBlockPluginLoaded = editor.plugins.has('ImageBlockEditing');
         const isInlinePluginLoaded = editor.plugins.has('ImageInlineEditing');
-        editor.config.define('image.styles', getDefaultStylesConfiguration(isBlockPluginLoaded, isInlinePluginLoaded));
-        this.normalizedStyles = normalizeStyles({
+        editor.config.define('image.styles', utils.getDefaultStylesConfiguration(isBlockPluginLoaded, isInlinePluginLoaded));
+        this.normalizedStyles = utils.normalizeStyles({
             configuredStyles: editor.config.get('image.styles'),
             isBlockPluginLoaded,
             isInlinePluginLoaded
@@ -80,11 +79,13 @@ export default class ImageStyleEditing extends Plugin {
         // We could call it 'style' but https://github.com/ckeditor/ckeditor5-engine/issues/559.
         if (isBlockPluginLoaded) {
             schema.extend('imageBlock', { allowAttributes: 'imageStyle' });
+            schema.setAttributeProperties('imageStyle', { isFormatting: true });
             // Converter for figure element from view to model.
             editor.data.upcastDispatcher.on('element:figure', viewToModelConverter, { priority: 'low' });
         }
         if (isInlinePluginLoaded) {
             schema.extend('imageInline', { allowAttributes: 'imageStyle' });
+            schema.setAttributeProperties('imageStyle', { isFormatting: true });
             // Converter for the img element from view to model.
             editor.data.upcastDispatcher.on('element:img', viewToModelConverter, { priority: 'low' });
         }

package/src/imagestyle/imagestyleui.d.ts

@@ -6,7 +6,7 @@
  * @module image/imagestyle/imagestyleui
  */
 import { Plugin } from 'ckeditor5/src/core.js';
-import ImageStyleEditing from './imagestyleediting.js';
+import { ImageStyleEditing } from './imagestyleediting.js';
 import '../../theme/imagestyle.css';
 /**
  * The image style UI plugin.
@@ -15,7 +15,7 @@ import '../../theme/imagestyle.css';
  * It also registers the {@link module:image/imagestyle/utils#DEFAULT_DROPDOWN_DEFINITIONS default drop-downs} and the
  * custom drop-downs defined by the developer in the {@link module:image/imageconfig~ImageConfig#toolbar} configuration.
  */
-export default class ImageStyleUI extends Plugin {
+export declare class ImageStyleUI extends Plugin {
     /**
      * @inheritDoc
      */

package/src/imagestyle/imagestyleui.js

@@ -8,8 +8,8 @@
 import { Plugin } from 'ckeditor5/src/core.js';
 import { ButtonView, createDropdown, addToolbarToDropdown, SplitButtonView } from 'ckeditor5/src/ui.js';
 import { isObject, identity } from 'es-toolkit/compat';
-import ImageStyleEditing from './imagestyleediting.js';
-import utils from './utils.js';
+import { ImageStyleEditing } from './imagestyleediting.js';
+import { utils } from './utils.js';
 import '../../theme/imagestyle.css';
 /**
  * The image style UI plugin.
@@ -18,7 +18,7 @@ import '../../theme/imagestyle.css';
  * It also registers the {@link module:image/imagestyle/utils#DEFAULT_DROPDOWN_DEFINITIONS default drop-downs} and the
  * custom drop-downs defined by the developer in the {@link module:image/imageconfig~ImageConfig#toolbar} configuration.
  */
-export default class ImageStyleUI extends Plugin {
+export class ImageStyleUI extends Plugin {
     /**
      * @inheritDoc
      */

package/src/imagestyle/utils.d.ts

@@ -21,6 +21,8 @@ import type { ImageStyleConfig, ImageStyleDropdownDefinition, ImageStyleOptionDe
  * * **`'inline'`** is an inline image without any CSS class,
  * * **`'block'`** is a block image without any CSS class,
  * * **`'side'`** is a block image styled with the `image-style-side` CSS class.
+ *
+ * @internal
  */
 export declare const DEFAULT_OPTIONS: Record<string, ImageStyleOptionDefinition>;
 /**
@@ -30,6 +32,8 @@ export declare const DEFAULT_OPTIONS: Record<string, ImageStyleOptionDefinition>
  * See {@link module:image/imageconfig~ImageStyleOptionDefinition#icon} to learn more.
  *
  * There are 7 default icons available: `'full'`, `'left'`, `'inlineLeft'`, `'center'`, `'right'`, `'inlineRight'`, and `'inline'`.
+ *
+ * @internal
  */
 export declare const DEFAULT_ICONS: Record<string, string>;
 /**
@@ -42,6 +46,8 @@ export declare const DEFAULT_ICONS: Record<string, string>;
  * those that wraps the text around the image,
  * * **`'imageStyle:breakText'`**, which contains the `alignBlockLeft`, `alignCenter` and `alignBlockRight` options, that is,
  * those that breaks the text around the image.
+ *
+ * @internal
  */
 export declare const DEFAULT_DROPDOWN_DEFINITIONS: Array<ImageStyleDropdownDefinition>;
 /**
@@ -86,13 +92,13 @@ declare function getDefaultDropdownDefinitions(pluginCollection: PluginCollectio
  * Displays a console warning with the 'image-style-configuration-definition-invalid' error.
  */
 declare function warnInvalidStyle(info: object): void;
-declare const _default: {
+/**
+ * @internal
+ */
+export declare const utils: {
     normalizeStyles: typeof normalizeStyles;
     getDefaultStylesConfiguration: typeof getDefaultStylesConfiguration;
     getDefaultDropdownDefinitions: typeof getDefaultDropdownDefinitions;
     warnInvalidStyle: typeof warnInvalidStyle;
-    DEFAULT_OPTIONS: Record<string, ImageStyleOptionDefinition>;
-    DEFAULT_ICONS: Record<string, string>;
-    DEFAULT_DROPDOWN_DEFINITIONS: ImageStyleDropdownDefinition[];
 };
-export default _default;
+export {};