@ckeditor/ckeditor5-image

{ "plugins": [ { "name": "Auto image", "className": "AutoImage", "description": "Allows for inserting images simply by pasting a URL of the image into the content. It turns the pasted URL into an image on the go.", "docs": "features/images/images-inserting.html#inserting-images-via-pasting-a-url-into-the-editor", "path": "src/autoimage.js", "requires": [ [ "ImageBlock", "ImageInline" ] ] }, { "name": "Block image", "className": "ImageBlock", "description": "Enables support for inserting images between the blocks of text, like paragraphs or block quotes. This functionality is also provided by the main Image plugin. Note: The image feature is introduced in a granular form, implemented by separate plugins responsible for such aspects as image caption, toolbar, resize, upload or styles.", "docs": "features/images/images-installation.html#inline-and-block-images", "path": "src/imageblock.js", "uiComponents": [ { "type": "Button", "name": "imageTextAlternative", "iconPath": "@ckeditor/ckeditor5-icons/theme/icons/text-alternative.svg", "toolbars": [ "image.toolbar" ] } ], "htmlOutput": [ { "elements": "figure", "classes": "image" }, { "elements": "img", "attributes": [ "alt", "height", "sizes", "src", "srcset", "width" ] } ] }, { "name": "Inline image", "className": "ImageInline", "description": "Enables support for inserting images inside the blocks of text, like paragraphs, header or block quotes. This functionality is also provided by the main Image plugin. Note: The image feature is introduced in a granular form, implemented by separate plugins responsible for such aspects as image toolbar, resize, upload or styles.", "docs": "features/images/images-installation.html#inline-and-block-images", "path": "src/imageinline.js", "uiComponents": [ { "type": "Button", "name": "imageTextAlternative", "iconPath": "@ckeditor/ckeditor5-icons/theme/icons/text-alternative.svg", "toolbars": [ "image.toolbar" ] } ], "htmlOutput": [ { "elements": "img", "attributes": [ "alt", "height", "sizes", "src", "srcset", "width" ] } ] }, { "name": "Image", "className": "Image", "description": "Enables support for image handling. Note: The image feature is introduced in a granular form, implemented by separate plugins responsible for such aspects as image caption, toolbar, resize, upload or styles.", "docs": "features/images/images-overview.html", "path": "src/image.js" }, { "name": "Image caption", "className": "ImageCaption", "description": "Allows for adding captions to block images to give additional context.", "docs": "features/images/images-captions.html", "path": "src/imagecaption.js", "requires": [ "ImageBlock" ], "uiComponents": [ { "type": "Button", "name": "toggleImageCaption", "iconPath": "@ckeditor/ckeditor5-icons/theme/icons/caption.svg", "toolbars": [ "image.toolbar" ] } ], "htmlOutput": [ { "elements": "figcaption" } ] }, { "name": "Image resize", "className": "ImageResize", "description": "Allows for resizing images using handles and offers the UI to fine tune the sizes.", "docs": "features/images/images-resizing.html", "path": "src/imageresize.js", "requires": [ [ "ImageBlock", "ImageInline" ] ], "htmlOutput": [ { "elements": "figure", "classes": "image_resized", "styles": [ "height", "width" ] }, { "elements": "img", "classes": "image_resized", "styles": [ "aspect-ratio", "height", "width" ] } ] }, { "name": "Image style", "className": "ImageStyle", "description": "Allows for using predefined, configurable styles to display the images, for example, as a full width image or side image.", "docs": "features/images/images-styles.html", "path": "src/imagestyle.js", "requires": [ [ "ImageBlock", "ImageInline" ] ], "uiComponents": [ { "type": "Button", "name": "imageStyle:inline", "toolbars": [ "image.toolbar" ], "iconPath": "@ckeditor/ckeditor5-icons/theme/icons/object-inline.svg" }, { "type": "Button", "name": "imageStyle:block", "toolbars": [ "image.toolbar" ], "iconPath": "@ckeditor/ckeditor5-icons/theme/icons/object-center.svg" }, { "type": "Button", "name": "imageStyle:side", "toolbars": [ "image.toolbar" ], "iconPath": "@ckeditor/ckeditor5-icons/theme/icons/object-right.svg" } ], "htmlOutput": [ { "elements": "figure", "classes": [ "image-style-side", "image-style-align-left", "image-style-align-right", "image-style-block-align-center", "image-style-block-align-left", "image-style-block-align-right" ] }, { "elements": "figure", "classes": "*", "isAlternative": true, "_comment": "The plugin can be configured to set any class names on the `<figure>` element." } ] }, { "name": "Image toolbar", "className": "ImageToolbar", "description": "Introduces a contextual toolbar for images. It appears when an image is selected and can be configured to contain buttons for features such as the text alternative or image styles.", "docs": "features/images/images-overview.html#image-contextual-toolbar", "path": "src/imagetoolbar.js", "requires": [ [ "ImageBlock", "ImageInline" ] ], "registeredToolbars": [ "image.toolbar" ] }, { "name": "Image upload", "className": "ImageUpload", "description": "Allows for pasting images from the clipboard, dragging and dropping of images, selecting them through a file system dialog or from a media management tool. You need to set this plugin up with an official or a custom upload adapter.", "docs": "features/images/image-upload/image-upload.html", "path": "src/imageupload.js", "requires": [ [ "ImageBlock", "ImageInline" ] ], "uiComponents": [ { "type": "Button", "name": "uploadImage", "iconPath": "@ckeditor/ckeditor5-icons/theme/icons/image.svg" } ] }, { "name": "Image insert", "className": "ImageInsert", "description": "Allows for inserting images via source URL.", "docs": "features/images/images-inserting.html", "path": "src/imageinsert.js", "requires": [ "ImageUpload" ], "uiComponents": [ { "type": "SplitButton", "name": "insertImage", "iconPath": "@ckeditor/ckeditor5-icons/theme/icons/image.svg" } ] }, { "name": "Image insert via URL", "className": "ImageInsertViaUrl", "description": "The image insert via URL plugin. This plugin does not do anything directly, but it loads a set of specific plugins to enable image inserting via URL.", "docs": "features/images/images-inserting.html#inserting-images-via-a-source-url", "path": "src/imageinsertviaurl.js", "uiComponents": [ { "type": "Button", "name": "insertImageViaUrl", "iconPath": "@ckeditor/ckeditor5-icons/theme/icons/image-url.svg" } ] }, { "name": "Image utils", "className": "ImageUtils", "description": "Provides utility functions for image handling.", "docs": "features/images/images-overview.html", "path": "src/imageutils.js" }, { "name": "Image editing", "className": "ImageEditing", "description": "Provides basic common image engine features.", "docs": "features/images/images-overview.html", "path": "src/image/imageediting.js" } ] }