@ckeditor/ckeditor5-image 32.0.0 → 33.0.0

package/src/imagecaption/toggleimagecaptioncommand.js

@@ -10,7 +10,6 @@
 import { Command } from 'ckeditor5/src/core';
 
 import ImageBlockEditing from '../image/imageblockediting';
-import { getCaptionFromImageModelElement, getCaptionFromModelSelection } from './utils';
 
 /**
  * The toggle image caption command.
@@ -41,7 +40,7 @@ export default class ToggleImageCaptionCommand extends Command {
 	 */
 	refresh() {
 		const editor = this.editor;
-		const imageUtils = editor.plugins.get( 'ImageUtils' );
+		const imageCaptionUtils = editor.plugins.get( 'ImageCaptionUtils' );
 
 		// Only block images can get captions.
 		if ( !editor.plugins.has( ImageBlockEditing ) ) {
@@ -55,7 +54,7 @@ export default class ToggleImageCaptionCommand extends Command {
 		const selectedElement = selection.getSelectedElement();
 
 		if ( !selectedElement ) {
-			const ancestorCaptionElement = getCaptionFromModelSelection( imageUtils, selection );
+			const ancestorCaptionElement = imageCaptionUtils.getCaptionFromModelSelection( selection );
 
 			this.isEnabled = !!ancestorCaptionElement;
 			this.value = !!ancestorCaptionElement;
@@ -70,7 +69,7 @@ export default class ToggleImageCaptionCommand extends Command {
 		if ( !this.isEnabled ) {
 			this.value = false;
 		} else {
-			this.value = !!getCaptionFromImageModelElement( selectedElement );
+			this.value = !!imageCaptionUtils.getCaptionFromImageModelElement( selectedElement );
 		}
 	}
 
@@ -145,14 +144,14 @@ export default class ToggleImageCaptionCommand extends Command {
 		const editor = this.editor;
 		const selection = editor.model.document.selection;
 		const imageCaptionEditing = editor.plugins.get( 'ImageCaptionEditing' );
-		const imageUtils = editor.plugins.get( 'ImageUtils' );
+		const imageCaptionUtils = editor.plugins.get( 'ImageCaptionUtils' );
 		let selectedImage = selection.getSelectedElement();
 		let captionElement;
 
 		if ( selectedImage ) {
-			captionElement = getCaptionFromImageModelElement( selectedImage );
+			captionElement = imageCaptionUtils.getCaptionFromImageModelElement( selectedImage );
 		} else {
-			captionElement = getCaptionFromModelSelection( imageUtils, selection );
+			captionElement = imageCaptionUtils.getCaptionFromModelSelection( selection );
 			selectedImage = captionElement.parent;
 		}
 

package/src/imagestyle/utils.js

@@ -40,75 +40,91 @@ const {
  */
 const DEFAULT_OPTIONS = {
 	// This style represents an image placed in the line of text.
-	inline: {
-		name: 'inline',
-		title: 'In line',
-		icon: objectInline,
-		modelElements: [ 'imageInline' ],
-		isDefault: true
+	get inline() {
+		return {
+			name: 'inline',
+			title: 'In line',
+			icon: objectInline,
+			modelElements: [ 'imageInline' ],
+			isDefault: true
+		};
 	},
 
 	// This style represents an image aligned to the left and wrapped with text.
-	alignLeft: {
-		name: 'alignLeft',
-		title: 'Left aligned image',
-		icon: objectLeft,
-		modelElements: [ 'imageBlock', 'imageInline' ],
-		className: 'image-style-align-left'
+	get alignLeft() {
+		return {
+			name: 'alignLeft',
+			title: 'Left aligned image',
+			icon: objectLeft,
+			modelElements: [ 'imageBlock', 'imageInline' ],
+			className: 'image-style-align-left'
+		};
 	},
 
 	// This style represents an image aligned to the left.
-	alignBlockLeft: {
-		name: 'alignBlockLeft',
-		title: 'Left aligned image',
-		icon: objectBlockLeft,
-		modelElements: [ 'imageBlock' ],
-		className: 'image-style-block-align-left'
+	get alignBlockLeft() {
+		return {
+			name: 'alignBlockLeft',
+			title: 'Left aligned image',
+			icon: objectBlockLeft,
+			modelElements: [ 'imageBlock' ],
+			className: 'image-style-block-align-left'
+		};
 	},
 
 	// This style represents a centered image.
-	alignCenter: {
-		name: 'alignCenter',
-		title: 'Centered image',
-		icon: objectCenter,
-		modelElements: [ 'imageBlock' ],
-		className: 'image-style-align-center'
+	get alignCenter() {
+		return {
+			name: 'alignCenter',
+			title: 'Centered image',
+			icon: objectCenter,
+			modelElements: [ 'imageBlock' ],
+			className: 'image-style-align-center'
+		};
 	},
 
 	// This style represents an image aligned to the right and wrapped with text.
-	alignRight: {
-		name: 'alignRight',
-		title: 'Right aligned image',
-		icon: objectRight,
-		modelElements: [ 'imageBlock', 'imageInline' ],
-		className: 'image-style-align-right'
+	get alignRight() {
+		return {
+			name: 'alignRight',
+			title: 'Right aligned image',
+			icon: objectRight,
+			modelElements: [ 'imageBlock', 'imageInline' ],
+			className: 'image-style-align-right'
+		};
 	},
 
 	// This style represents an image aligned to the right.
-	alignBlockRight: {
-		name: 'alignBlockRight',
-		title: 'Right aligned image',
-		icon: objectBlockRight,
-		modelElements: [ 'imageBlock' ],
-		className: 'image-style-block-align-right'
+	get alignBlockRight() {
+		return {
+			name: 'alignBlockRight',
+			title: 'Right aligned image',
+			icon: objectBlockRight,
+			modelElements: [ 'imageBlock' ],
+			className: 'image-style-block-align-right'
+		};
 	},
 
 	// This option is equal to the situation when no style is applied.
-	block: {
-		name: 'block',
-		title: 'Centered image',
-		icon: objectCenter,
-		modelElements: [ 'imageBlock' ],
-		isDefault: true
+	get block() {
+		return {
+			name: 'block',
+			title: 'Centered image',
+			icon: objectCenter,
+			modelElements: [ 'imageBlock' ],
+			isDefault: true
+		};
 	},
 
 	// This represents a side image.
-	side: {
-		name: 'side',
-		title: 'Side image',
-		icon: objectRight,
-		modelElements: [ 'imageBlock' ],
-		className: 'image-style-side'
+	get side() {
+		return {
+			name: 'side',
+			title: 'Side image',
+			icon: objectRight,
+			modelElements: [ 'imageBlock' ],
+			className: 'image-style-side'
+		};
 	}
 };
 

package/src/index.js

@@ -10,6 +10,7 @@
 export { default as AutoImage } from './autoimage';
 export { default as Image } from './image';
 export { default as ImageEditing } from './image/imageediting';
+export { default as ImageCaptionUtils } from './imagecaption/imagecaptionutils';
 export { default as ImageCaption } from './imagecaption';
 export { default as ImageCaptionEditing } from './imagecaption/imagecaptionediting';
 export { default as ImageInsert } from './imageinsert';

package/src/imagecaption/utils.js

@@ -1,63 +0,0 @@
-/**
- * @license Copyright (c) 2003-2022, CKSource Holding sp. z o.o. All rights reserved.
- * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
- */
-
-/**
- * @module image/imagecaption/utils
- */
-
-/**
- * Returns the caption model element from a given image element. Returns `null` if no caption is found.
- *
- * @param {module:engine/model/element~Element} imageModelElement
- * @returns {module:engine/model/element~Element|null}
- */
-export function getCaptionFromImageModelElement( imageModelElement ) {
-	for ( const node of imageModelElement.getChildren() ) {
-		if ( !!node && node.is( 'element', 'caption' ) ) {
-			return node;
-		}
-	}
-
-	return null;
-}
-
-/**
- * Returns the caption model element for a model selection. Returns `null` if the selection has no caption element ancestor.
- *
- * @param {module:image/imageutils~ImageUtils} imageUtils
- * @param {module:engine/model/selection~Selection} selection
- * @returns {module:engine/model/element~Element|null}
- */
-export function getCaptionFromModelSelection( imageUtils, selection ) {
-	const captionElement = selection.getFirstPosition().findAncestor( 'caption' );
-
-	if ( !captionElement ) {
-		return null;
-	}
-
-	if ( imageUtils.isBlockImage( captionElement.parent ) ) {
-		return captionElement;
-	}
-
-	return null;
-}
-
-/**
- * {@link module:engine/view/matcher~Matcher} pattern. Checks if a given element is a `<figcaption>` element that is placed
- * inside the image `<figure>` element.
- *
- * @param {module:image/imageutils~ImageUtils} imageUtils
- * @param {module:engine/view/element~Element} element
- * @returns {Object|null} Returns the object accepted by {@link module:engine/view/matcher~Matcher} or `null` if the element
- * cannot be matched.
- */
-export function matchImageCaptionViewElement( imageUtils, element ) {
-	// Convert only captions for images.
-	if ( element.name == 'figcaption' && imageUtils.isBlockImageView( element.parent ) ) {
-		return { name: true };
-	}
-
-	return null;
-}