@ckeditor/ckeditor5-image 40.0.0 → 40.2.0

package/src/imagestyle/imagestylecommand.js

@@ -1,107 +1,107 @@
-/**
- * @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
- * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
- */
-import { Command } from 'ckeditor5/src/core';
-/**
- * The image style command. It is used to apply {@link module:image/imageconfig~ImageStyleConfig#options image style option}
- * to a selected image.
- *
- * **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 {
-    /**
-     * Creates an instance of the image style command. When executed, the command applies one of
-     * {@link module:image/imageconfig~ImageStyleConfig#options style options} to the currently selected image.
-     *
-     * @param editor The editor instance.
-     * @param styles The style options that this command supports.
-     */
-    constructor(editor, styles) {
-        super(editor);
-        this._defaultStyles = {
-            imageBlock: false,
-            imageInline: false
-        };
-        this._styles = new Map(styles.map(style => {
-            if (style.isDefault) {
-                for (const modelElementName of style.modelElements) {
-                    this._defaultStyles[modelElementName] = style.name;
-                }
-            }
-            return [style.name, style];
-        }));
-    }
-    /**
-     * @inheritDoc
-     */
-    refresh() {
-        const editor = this.editor;
-        const imageUtils = editor.plugins.get('ImageUtils');
-        const element = imageUtils.getClosestSelectedImageElement(this.editor.model.document.selection);
-        this.isEnabled = !!element;
-        if (!this.isEnabled) {
-            this.value = false;
-        }
-        else if (element.hasAttribute('imageStyle')) {
-            this.value = element.getAttribute('imageStyle');
-        }
-        else {
-            this.value = this._defaultStyles[element.name];
-        }
-    }
-    /**
-     * Executes the command and applies the style to the currently selected image:
-     *
-     * ```ts
-     * editor.execute( 'imageStyle', { value: 'side' } );
-     * ```
-     *
-     * **Note**: Executing this command may change the image model element if the desired style requires an image
-     * of a different type. Learn more about {@link module:image/imageconfig~ImageStyleOptionDefinition#modelElements model element}
-     * configuration for the style option.
-     *
-     * @param options.value The name of the style (as configured in {@link module:image/imageconfig~ImageStyleConfig#options}).
-     * @param options.setImageSizes Specifies whether the image `width` and `height` attributes should be set automatically.
-     * The default is `true`.
-     * @fires execute
-     */
-    execute(options = {}) {
-        const editor = this.editor;
-        const model = editor.model;
-        const imageUtils = editor.plugins.get('ImageUtils');
-        model.change(writer => {
-            const requestedStyle = options.value;
-            const { setImageSizes = true } = options;
-            let imageElement = imageUtils.getClosestSelectedImageElement(model.document.selection);
-            // Change the image type if a style requires it.
-            if (requestedStyle && this.shouldConvertImageType(requestedStyle, imageElement)) {
-                this.editor.execute(imageUtils.isBlockImage(imageElement) ? 'imageTypeInline' : 'imageTypeBlock', { setImageSizes });
-                // Update the imageElement to the newly created image.
-                imageElement = imageUtils.getClosestSelectedImageElement(model.document.selection);
-            }
-            // Default style means that there is no `imageStyle` attribute in the model.
-            // https://github.com/ckeditor/ckeditor5-image/issues/147
-            if (!requestedStyle || this._styles.get(requestedStyle).isDefault) {
-                writer.removeAttribute('imageStyle', imageElement);
-            }
-            else {
-                writer.setAttribute('imageStyle', requestedStyle, imageElement);
-            }
-            if (setImageSizes) {
-                imageUtils.setImageNaturalSizeAttributes(imageElement);
-            }
-        });
-    }
-    /**
-     * Returns `true` if requested style change would trigger the image type change.
-     *
-     * @param requestedStyle The name of the style (as configured in {@link module:image/imageconfig~ImageStyleConfig#options}).
-     * @param imageElement The image model element.
-     */
-    shouldConvertImageType(requestedStyle, imageElement) {
-        const supportedTypes = this._styles.get(requestedStyle).modelElements;
-        return !supportedTypes.includes(imageElement.name);
-    }
-}
+/**
+ * @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
+ */
+import { Command } from 'ckeditor5/src/core';
+/**
+ * The image style command. It is used to apply {@link module:image/imageconfig~ImageStyleConfig#options image style option}
+ * to a selected image.
+ *
+ * **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 {
+    /**
+     * Creates an instance of the image style command. When executed, the command applies one of
+     * {@link module:image/imageconfig~ImageStyleConfig#options style options} to the currently selected image.
+     *
+     * @param editor The editor instance.
+     * @param styles The style options that this command supports.
+     */
+    constructor(editor, styles) {
+        super(editor);
+        this._defaultStyles = {
+            imageBlock: false,
+            imageInline: false
+        };
+        this._styles = new Map(styles.map(style => {
+            if (style.isDefault) {
+                for (const modelElementName of style.modelElements) {
+                    this._defaultStyles[modelElementName] = style.name;
+                }
+            }
+            return [style.name, style];
+        }));
+    }
+    /**
+     * @inheritDoc
+     */
+    refresh() {
+        const editor = this.editor;
+        const imageUtils = editor.plugins.get('ImageUtils');
+        const element = imageUtils.getClosestSelectedImageElement(this.editor.model.document.selection);
+        this.isEnabled = !!element;
+        if (!this.isEnabled) {
+            this.value = false;
+        }
+        else if (element.hasAttribute('imageStyle')) {
+            this.value = element.getAttribute('imageStyle');
+        }
+        else {
+            this.value = this._defaultStyles[element.name];
+        }
+    }
+    /**
+     * Executes the command and applies the style to the currently selected image:
+     *
+     * ```ts
+     * editor.execute( 'imageStyle', { value: 'side' } );
+     * ```
+     *
+     * **Note**: Executing this command may change the image model element if the desired style requires an image
+     * of a different type. Learn more about {@link module:image/imageconfig~ImageStyleOptionDefinition#modelElements model element}
+     * configuration for the style option.
+     *
+     * @param options.value The name of the style (as configured in {@link module:image/imageconfig~ImageStyleConfig#options}).
+     * @param options.setImageSizes Specifies whether the image `width` and `height` attributes should be set automatically.
+     * The default is `true`.
+     * @fires execute
+     */
+    execute(options = {}) {
+        const editor = this.editor;
+        const model = editor.model;
+        const imageUtils = editor.plugins.get('ImageUtils');
+        model.change(writer => {
+            const requestedStyle = options.value;
+            const { setImageSizes = true } = options;
+            let imageElement = imageUtils.getClosestSelectedImageElement(model.document.selection);
+            // Change the image type if a style requires it.
+            if (requestedStyle && this.shouldConvertImageType(requestedStyle, imageElement)) {
+                this.editor.execute(imageUtils.isBlockImage(imageElement) ? 'imageTypeInline' : 'imageTypeBlock', { setImageSizes });
+                // Update the imageElement to the newly created image.
+                imageElement = imageUtils.getClosestSelectedImageElement(model.document.selection);
+            }
+            // Default style means that there is no `imageStyle` attribute in the model.
+            // https://github.com/ckeditor/ckeditor5-image/issues/147
+            if (!requestedStyle || this._styles.get(requestedStyle).isDefault) {
+                writer.removeAttribute('imageStyle', imageElement);
+            }
+            else {
+                writer.setAttribute('imageStyle', requestedStyle, imageElement);
+            }
+            if (setImageSizes) {
+                imageUtils.setImageNaturalSizeAttributes(imageElement);
+            }
+        });
+    }
+    /**
+     * Returns `true` if requested style change would trigger the image type change.
+     *
+     * @param requestedStyle The name of the style (as configured in {@link module:image/imageconfig~ImageStyleConfig#options}).
+     * @param imageElement The image model element.
+     */
+    shouldConvertImageType(requestedStyle, imageElement) {
+        const supportedTypes = this._styles.get(requestedStyle).modelElements;
+        return !supportedTypes.includes(imageElement.name);
+    }
+}

package/src/imagestyle/imagestyleediting.d.ts

@@ -1,50 +1,50 @@
-/**
- * @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
- * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
- */
-/**
- * @module image/imagestyle/imagestyleediting
- */
-import { Plugin } from 'ckeditor5/src/core';
-import ImageUtils from '../imageutils';
-import type { ImageStyleOptionDefinition } from '../imageconfig';
-/**
- * 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 {
-    /**
-     * @inheritDoc
-     */
-    static get pluginName(): "ImageStyleEditing";
-    /**
-     * @inheritDoc
-     */
-    static get requires(): readonly [typeof ImageUtils];
-    /**
-     * It contains a list of the normalized and validated style options.
-     *
-     * * Each option contains a complete icon markup.
-     * * The style options not supported by any of the loaded image editing plugins (
-     * {@link module:image/image/imageinlineediting~ImageInlineEditing `ImageInlineEditing`} or
-     * {@link module:image/image/imageblockediting~ImageBlockEditing `ImageBlockEditing`}) are filtered out.
-     *
-     * @internal
-     * @readonly
-     */
-    normalizedStyles?: Array<ImageStyleOptionDefinition>;
-    /**
-     * @inheritDoc
-     */
-    init(): void;
-    /**
-     * Sets the editor conversion taking the presence of
-     * {@link module:image/image/imageinlineediting~ImageInlineEditing `ImageInlineEditing`}
-     * and {@link module:image/image/imageblockediting~ImageBlockEditing `ImageBlockEditing`} plugins into consideration.
-     */
-    private _setupConversion;
-    /**
-     * Registers a post-fixer that will make sure that the style attribute value is correct for a specific image type (block vs inline).
-     */
-    private _setupPostFixer;
-}
+/**
+ * @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
+ */
+/**
+ * @module image/imagestyle/imagestyleediting
+ */
+import { Plugin } from 'ckeditor5/src/core';
+import ImageUtils from '../imageutils';
+import type { ImageStyleOptionDefinition } from '../imageconfig';
+/**
+ * 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 {
+    /**
+     * @inheritDoc
+     */
+    static get pluginName(): "ImageStyleEditing";
+    /**
+     * @inheritDoc
+     */
+    static get requires(): readonly [typeof ImageUtils];
+    /**
+     * It contains a list of the normalized and validated style options.
+     *
+     * * Each option contains a complete icon markup.
+     * * The style options not supported by any of the loaded image editing plugins (
+     * {@link module:image/image/imageinlineediting~ImageInlineEditing `ImageInlineEditing`} or
+     * {@link module:image/image/imageblockediting~ImageBlockEditing `ImageBlockEditing`}) are filtered out.
+     *
+     * @internal
+     * @readonly
+     */
+    normalizedStyles?: Array<ImageStyleOptionDefinition>;
+    /**
+     * @inheritDoc
+     */
+    init(): void;
+    /**
+     * Sets the editor conversion taking the presence of
+     * {@link module:image/image/imageinlineediting~ImageInlineEditing `ImageInlineEditing`}
+     * and {@link module:image/image/imageblockediting~ImageBlockEditing `ImageBlockEditing`} plugins into consideration.
+     */
+    private _setupConversion;
+    /**
+     * Registers a post-fixer that will make sure that the style attribute value is correct for a specific image type (block vs inline).
+     */
+    private _setupPostFixer;
+}

package/src/imagestyle/imagestyleediting.js

@@ -1,108 +1,108 @@
-/**
- * @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
- * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
- */
-/**
- * @module image/imagestyle/imagestyleediting
- */
-import { Plugin } from 'ckeditor5/src/core';
-import ImageStyleCommand from './imagestylecommand';
-import ImageUtils from '../imageutils';
-import utils from './utils';
-import { viewToModelStyleAttribute, modelToViewStyleAttribute } from './converters';
-/**
- * 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 {
-    /**
-     * @inheritDoc
-     */
-    static get pluginName() {
-        return 'ImageStyleEditing';
-    }
-    /**
-     * @inheritDoc
-     */
-    static get requires() {
-        return [ImageUtils];
-    }
-    /**
-     * @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({
-            configuredStyles: editor.config.get('image.styles'),
-            isBlockPluginLoaded,
-            isInlinePluginLoaded
-        });
-        this._setupConversion(isBlockPluginLoaded, isInlinePluginLoaded);
-        this._setupPostFixer();
-        // Register imageStyle command.
-        editor.commands.add('imageStyle', new ImageStyleCommand(editor, this.normalizedStyles));
-    }
-    /**
-     * Sets the editor conversion taking the presence of
-     * {@link module:image/image/imageinlineediting~ImageInlineEditing `ImageInlineEditing`}
-     * and {@link module:image/image/imageblockediting~ImageBlockEditing `ImageBlockEditing`} plugins into consideration.
-     */
-    _setupConversion(isBlockPluginLoaded, isInlinePluginLoaded) {
-        const editor = this.editor;
-        const schema = editor.model.schema;
-        const modelToViewConverter = modelToViewStyleAttribute(this.normalizedStyles);
-        const viewToModelConverter = viewToModelStyleAttribute(this.normalizedStyles);
-        editor.editing.downcastDispatcher.on('attribute:imageStyle', modelToViewConverter);
-        editor.data.downcastDispatcher.on('attribute:imageStyle', modelToViewConverter);
-        // Allow imageStyle attribute in image and imageInline.
-        // We could call it 'style' but https://github.com/ckeditor/ckeditor5-engine/issues/559.
-        if (isBlockPluginLoaded) {
-            schema.extend('imageBlock', { allowAttributes: 'imageStyle' });
-            // Converter for figure element from view to model.
-            editor.data.upcastDispatcher.on('element:figure', viewToModelConverter, { priority: 'low' });
-        }
-        if (isInlinePluginLoaded) {
-            schema.extend('imageInline', { allowAttributes: 'imageStyle' });
-            // Converter for the img element from view to model.
-            editor.data.upcastDispatcher.on('element:img', viewToModelConverter, { priority: 'low' });
-        }
-    }
-    /**
-     * Registers a post-fixer that will make sure that the style attribute value is correct for a specific image type (block vs inline).
-     */
-    _setupPostFixer() {
-        const editor = this.editor;
-        const document = editor.model.document;
-        const imageUtils = editor.plugins.get(ImageUtils);
-        const stylesMap = new Map(this.normalizedStyles.map(style => [style.name, style]));
-        // Make sure that style attribute is valid for the image type.
-        document.registerPostFixer(writer => {
-            let changed = false;
-            for (const change of document.differ.getChanges()) {
-                if (change.type == 'insert' || change.type == 'attribute' && change.attributeKey == 'imageStyle') {
-                    let element = change.type == 'insert' ? change.position.nodeAfter : change.range.start.nodeAfter;
-                    if (element && element.is('element', 'paragraph') && element.childCount > 0) {
-                        element = element.getChild(0);
-                    }
-                    if (!imageUtils.isImage(element)) {
-                        continue;
-                    }
-                    const imageStyle = element.getAttribute('imageStyle');
-                    if (!imageStyle) {
-                        continue;
-                    }
-                    const imageStyleDefinition = stylesMap.get(imageStyle);
-                    if (!imageStyleDefinition || !imageStyleDefinition.modelElements.includes(element.name)) {
-                        writer.removeAttribute('imageStyle', element);
-                        changed = true;
-                    }
-                }
-            }
-            return changed;
-        });
-    }
-}
+/**
+ * @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
+ */
+/**
+ * @module image/imagestyle/imagestyleediting
+ */
+import { Plugin } from 'ckeditor5/src/core';
+import ImageStyleCommand from './imagestylecommand';
+import ImageUtils from '../imageutils';
+import utils from './utils';
+import { viewToModelStyleAttribute, modelToViewStyleAttribute } from './converters';
+/**
+ * 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 {
+    /**
+     * @inheritDoc
+     */
+    static get pluginName() {
+        return 'ImageStyleEditing';
+    }
+    /**
+     * @inheritDoc
+     */
+    static get requires() {
+        return [ImageUtils];
+    }
+    /**
+     * @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({
+            configuredStyles: editor.config.get('image.styles'),
+            isBlockPluginLoaded,
+            isInlinePluginLoaded
+        });
+        this._setupConversion(isBlockPluginLoaded, isInlinePluginLoaded);
+        this._setupPostFixer();
+        // Register imageStyle command.
+        editor.commands.add('imageStyle', new ImageStyleCommand(editor, this.normalizedStyles));
+    }
+    /**
+     * Sets the editor conversion taking the presence of
+     * {@link module:image/image/imageinlineediting~ImageInlineEditing `ImageInlineEditing`}
+     * and {@link module:image/image/imageblockediting~ImageBlockEditing `ImageBlockEditing`} plugins into consideration.
+     */
+    _setupConversion(isBlockPluginLoaded, isInlinePluginLoaded) {
+        const editor = this.editor;
+        const schema = editor.model.schema;
+        const modelToViewConverter = modelToViewStyleAttribute(this.normalizedStyles);
+        const viewToModelConverter = viewToModelStyleAttribute(this.normalizedStyles);
+        editor.editing.downcastDispatcher.on('attribute:imageStyle', modelToViewConverter);
+        editor.data.downcastDispatcher.on('attribute:imageStyle', modelToViewConverter);
+        // Allow imageStyle attribute in image and imageInline.
+        // We could call it 'style' but https://github.com/ckeditor/ckeditor5-engine/issues/559.
+        if (isBlockPluginLoaded) {
+            schema.extend('imageBlock', { allowAttributes: 'imageStyle' });
+            // Converter for figure element from view to model.
+            editor.data.upcastDispatcher.on('element:figure', viewToModelConverter, { priority: 'low' });
+        }
+        if (isInlinePluginLoaded) {
+            schema.extend('imageInline', { allowAttributes: 'imageStyle' });
+            // Converter for the img element from view to model.
+            editor.data.upcastDispatcher.on('element:img', viewToModelConverter, { priority: 'low' });
+        }
+    }
+    /**
+     * Registers a post-fixer that will make sure that the style attribute value is correct for a specific image type (block vs inline).
+     */
+    _setupPostFixer() {
+        const editor = this.editor;
+        const document = editor.model.document;
+        const imageUtils = editor.plugins.get(ImageUtils);
+        const stylesMap = new Map(this.normalizedStyles.map(style => [style.name, style]));
+        // Make sure that style attribute is valid for the image type.
+        document.registerPostFixer(writer => {
+            let changed = false;
+            for (const change of document.differ.getChanges()) {
+                if (change.type == 'insert' || change.type == 'attribute' && change.attributeKey == 'imageStyle') {
+                    let element = change.type == 'insert' ? change.position.nodeAfter : change.range.start.nodeAfter;
+                    if (element && element.is('element', 'paragraph') && element.childCount > 0) {
+                        element = element.getChild(0);
+                    }
+                    if (!imageUtils.isImage(element)) {
+                        continue;
+                    }
+                    const imageStyle = element.getAttribute('imageStyle');
+                    if (!imageStyle) {
+                        continue;
+                    }
+                    const imageStyleDefinition = stylesMap.get(imageStyle);
+                    if (!imageStyleDefinition || !imageStyleDefinition.modelElements.includes(element.name)) {
+                        writer.removeAttribute('imageStyle', element);
+                        changed = true;
+                    }
+                }
+            }
+            return changed;
+        });
+    }
+}

package/src/imagestyle/imagestyleui.d.ts

@@ -1,56 +1,56 @@
-/**
- * @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
- * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
- */
-/**
- * @module image/imagestyle/imagestyleui
- */
-import { Plugin } from 'ckeditor5/src/core';
-import ImageStyleEditing from './imagestyleediting';
-import '../../theme/imagestyle.css';
-/**
- * The image style UI plugin.
- *
- * It registers buttons corresponding to the {@link module:image/imageconfig~ImageConfig#styles} configuration.
- * 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 {
-    /**
-     * @inheritDoc
-     */
-    static get requires(): readonly [typeof ImageStyleEditing];
-    /**
-     * @inheritDoc
-     */
-    static get pluginName(): "ImageStyleUI";
-    /**
-     * Returns the default localized style titles provided by the plugin.
-     *
-     * The following localized titles corresponding with
-     * {@link module:image/imagestyle/utils#DEFAULT_OPTIONS} are available:
-     *
-     * * `'Wrap text'`,
-     * * `'Break text'`,
-     * * `'In line'`,
-     * * `'Full size image'`,
-     * * `'Side image'`,
-     * * `'Left aligned image'`,
-     * * `'Centered image'`,
-     * * `'Right aligned image'`
-     */
-    get localizedDefaultStylesTitles(): Record<string, string>;
-    /**
-     * @inheritDoc
-     */
-    init(): void;
-    /**
-     * Creates a dropdown and stores it in the editor {@link module:ui/componentfactory~ComponentFactory}.
-     */
-    private _createDropdown;
-    /**
-     * Creates a button and stores it in the editor {@link module:ui/componentfactory~ComponentFactory}.
-     */
-    private _createButton;
-    private _executeCommand;
-}
+/**
+ * @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
+ */
+/**
+ * @module image/imagestyle/imagestyleui
+ */
+import { Plugin } from 'ckeditor5/src/core';
+import ImageStyleEditing from './imagestyleediting';
+import '../../theme/imagestyle.css';
+/**
+ * The image style UI plugin.
+ *
+ * It registers buttons corresponding to the {@link module:image/imageconfig~ImageConfig#styles} configuration.
+ * 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 {
+    /**
+     * @inheritDoc
+     */
+    static get requires(): readonly [typeof ImageStyleEditing];
+    /**
+     * @inheritDoc
+     */
+    static get pluginName(): "ImageStyleUI";
+    /**
+     * Returns the default localized style titles provided by the plugin.
+     *
+     * The following localized titles corresponding with
+     * {@link module:image/imagestyle/utils#DEFAULT_OPTIONS} are available:
+     *
+     * * `'Wrap text'`,
+     * * `'Break text'`,
+     * * `'In line'`,
+     * * `'Full size image'`,
+     * * `'Side image'`,
+     * * `'Left aligned image'`,
+     * * `'Centered image'`,
+     * * `'Right aligned image'`
+     */
+    get localizedDefaultStylesTitles(): Record<string, string>;
+    /**
+     * @inheritDoc
+     */
+    init(): void;
+    /**
+     * Creates a dropdown and stores it in the editor {@link module:ui/componentfactory~ComponentFactory}.
+     */
+    private _createDropdown;
+    /**
+     * Creates a button and stores it in the editor {@link module:ui/componentfactory~ComponentFactory}.
+     */
+    private _createButton;
+    private _executeCommand;
+}