@ckeditor/ckeditor5-image 38.0.1 → 38.1.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (109) hide show
  1. package/build/image.js +1 -1
  2. package/build/image.js.map +1 -0
  3. package/package.json +3 -42
  4. package/src/augmentation.d.ts +55 -55
  5. package/src/augmentation.js +5 -5
  6. package/src/autoimage.d.ts +52 -52
  7. package/src/autoimage.js +132 -132
  8. package/src/image/converters.d.ts +66 -66
  9. package/src/image/converters.js +242 -242
  10. package/src/image/imageblockediting.d.ts +55 -55
  11. package/src/image/imageblockediting.js +136 -136
  12. package/src/image/imageediting.d.ts +30 -30
  13. package/src/image/imageediting.js +74 -74
  14. package/src/image/imageinlineediting.d.ts +56 -56
  15. package/src/image/imageinlineediting.js +160 -160
  16. package/src/image/imageloadobserver.d.ts +48 -48
  17. package/src/image/imageloadobserver.js +52 -52
  18. package/src/image/imagetypecommand.d.ts +40 -40
  19. package/src/image/imagetypecommand.js +77 -77
  20. package/src/image/insertimagecommand.d.ts +66 -66
  21. package/src/image/insertimagecommand.js +120 -120
  22. package/src/image/replaceimagesourcecommand.d.ts +34 -34
  23. package/src/image/replaceimagesourcecommand.js +44 -44
  24. package/src/image/ui/utils.d.ts +25 -25
  25. package/src/image/ui/utils.js +44 -44
  26. package/src/image/utils.d.ts +52 -52
  27. package/src/image/utils.js +100 -100
  28. package/src/image.d.ts +34 -34
  29. package/src/image.js +38 -38
  30. package/src/imageblock.d.ts +33 -33
  31. package/src/imageblock.js +37 -37
  32. package/src/imagecaption/imagecaptionediting.d.ts +89 -89
  33. package/src/imagecaption/imagecaptionediting.js +225 -225
  34. package/src/imagecaption/imagecaptionui.d.ts +26 -26
  35. package/src/imagecaption/imagecaptionui.js +61 -61
  36. package/src/imagecaption/imagecaptionutils.d.ts +38 -38
  37. package/src/imagecaption/imagecaptionutils.js +62 -62
  38. package/src/imagecaption/toggleimagecaptioncommand.d.ts +66 -66
  39. package/src/imagecaption/toggleimagecaptioncommand.js +138 -138
  40. package/src/imagecaption.d.ts +26 -26
  41. package/src/imagecaption.js +30 -30
  42. package/src/imageconfig.d.ts +713 -713
  43. package/src/imageconfig.js +5 -5
  44. package/src/imageinline.d.ts +33 -33
  45. package/src/imageinline.js +37 -37
  46. package/src/imageinsert/imageinsertui.d.ts +44 -44
  47. package/src/imageinsert/imageinsertui.js +141 -141
  48. package/src/imageinsert/ui/imageinsertformrowview.d.ts +61 -61
  49. package/src/imageinsert/ui/imageinsertformrowview.js +54 -54
  50. package/src/imageinsert/ui/imageinsertpanelview.d.ts +106 -106
  51. package/src/imageinsert/ui/imageinsertpanelview.js +161 -161
  52. package/src/imageinsert/utils.d.ts +25 -25
  53. package/src/imageinsert/utils.js +58 -58
  54. package/src/imageinsert.d.ts +33 -33
  55. package/src/imageinsert.js +37 -37
  56. package/src/imageinsertviaurl.d.ts +30 -30
  57. package/src/imageinsertviaurl.js +34 -34
  58. package/src/imageresize/imageresizebuttons.d.ts +67 -67
  59. package/src/imageresize/imageresizebuttons.js +217 -217
  60. package/src/imageresize/imageresizeediting.d.ts +37 -37
  61. package/src/imageresize/imageresizeediting.js +114 -114
  62. package/src/imageresize/imageresizehandles.d.ts +30 -30
  63. package/src/imageresize/imageresizehandles.js +107 -107
  64. package/src/imageresize/resizeimagecommand.d.ts +42 -42
  65. package/src/imageresize/resizeimagecommand.js +61 -61
  66. package/src/imageresize.d.ts +27 -27
  67. package/src/imageresize.js +31 -31
  68. package/src/imagestyle/converters.d.ts +24 -24
  69. package/src/imagestyle/converters.js +79 -79
  70. package/src/imagestyle/imagestylecommand.d.ts +65 -65
  71. package/src/imagestyle/imagestylecommand.js +101 -101
  72. package/src/imagestyle/imagestyleediting.d.ts +50 -50
  73. package/src/imagestyle/imagestyleediting.js +108 -108
  74. package/src/imagestyle/imagestyleui.d.ts +56 -56
  75. package/src/imagestyle/imagestyleui.js +192 -192
  76. package/src/imagestyle/utils.d.ts +101 -101
  77. package/src/imagestyle/utils.js +329 -329
  78. package/src/imagestyle.d.ts +32 -32
  79. package/src/imagestyle.js +36 -36
  80. package/src/imagetextalternative/imagetextalternativecommand.d.ts +34 -34
  81. package/src/imagetextalternative/imagetextalternativecommand.js +44 -44
  82. package/src/imagetextalternative/imagetextalternativeediting.d.ts +28 -28
  83. package/src/imagetextalternative/imagetextalternativeediting.js +35 -35
  84. package/src/imagetextalternative/imagetextalternativeui.d.ts +68 -68
  85. package/src/imagetextalternative/imagetextalternativeui.js +173 -173
  86. package/src/imagetextalternative/ui/textalternativeformview.d.ts +72 -72
  87. package/src/imagetextalternative/ui/textalternativeformview.js +121 -121
  88. package/src/imagetextalternative.d.ts +29 -29
  89. package/src/imagetextalternative.js +33 -33
  90. package/src/imagetoolbar.d.ts +35 -35
  91. package/src/imagetoolbar.js +57 -57
  92. package/src/imageupload/imageuploadediting.d.ts +111 -111
  93. package/src/imageupload/imageuploadediting.js +335 -335
  94. package/src/imageupload/imageuploadprogress.d.ts +42 -42
  95. package/src/imageupload/imageuploadprogress.js +211 -211
  96. package/src/imageupload/imageuploadui.d.ts +23 -23
  97. package/src/imageupload/imageuploadui.js +57 -57
  98. package/src/imageupload/uploadimagecommand.d.ts +60 -60
  99. package/src/imageupload/uploadimagecommand.js +100 -100
  100. package/src/imageupload/utils.d.ts +33 -33
  101. package/src/imageupload/utils.js +112 -112
  102. package/src/imageupload.d.ts +32 -32
  103. package/src/imageupload.js +36 -36
  104. package/src/imageutils.d.ts +102 -102
  105. package/src/imageutils.js +248 -248
  106. package/src/index.d.ts +47 -47
  107. package/src/index.js +38 -38
  108. package/src/pictureediting.d.ts +88 -88
  109. package/src/pictureediting.js +130 -130
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ckeditor/ckeditor5-image",
3
- "version": "38.0.1",
3
+ "version": "38.1.1",
4
4
  "description": "Image feature for CKEditor 5.",
5
5
  "keywords": [
6
6
  "ckeditor",
@@ -12,44 +12,10 @@
12
12
  ],
13
13
  "main": "src/index.js",
14
14
  "dependencies": {
15
- "@ckeditor/ckeditor5-ui": "^38.0.1",
16
- "ckeditor5": "^38.0.1",
15
+ "@ckeditor/ckeditor5-ui": "38.1.1",
16
+ "ckeditor5": "38.1.1",
17
17
  "lodash-es": "^4.17.15"
18
18
  },
19
- "devDependencies": {
20
- "@ckeditor/ckeditor5-adapter-ckfinder": "^38.0.1",
21
- "@ckeditor/ckeditor5-autoformat": "^38.0.1",
22
- "@ckeditor/ckeditor5-basic-styles": "^38.0.1",
23
- "@ckeditor/ckeditor5-block-quote": "^38.0.1",
24
- "@ckeditor/ckeditor5-ckfinder": "^38.0.1",
25
- "@ckeditor/ckeditor5-clipboard": "^38.0.1",
26
- "@ckeditor/ckeditor5-cloud-services": "^38.0.1",
27
- "@ckeditor/ckeditor5-core": "^38.0.1",
28
- "@ckeditor/ckeditor5-dev-utils": "^37.0.0",
29
- "@ckeditor/ckeditor5-easy-image": "^38.0.1",
30
- "@ckeditor/ckeditor5-editor-classic": "^38.0.1",
31
- "@ckeditor/ckeditor5-engine": "^38.0.1",
32
- "@ckeditor/ckeditor5-enter": "^38.0.1",
33
- "@ckeditor/ckeditor5-essentials": "^38.0.1",
34
- "@ckeditor/ckeditor5-heading": "^38.0.1",
35
- "@ckeditor/ckeditor5-html-embed": "^38.0.1",
36
- "@ckeditor/ckeditor5-indent": "^38.0.1",
37
- "@ckeditor/ckeditor5-link": "^38.0.1",
38
- "@ckeditor/ckeditor5-list": "^38.0.1",
39
- "@ckeditor/ckeditor5-media-embed": "^38.0.1",
40
- "@ckeditor/ckeditor5-paragraph": "^38.0.1",
41
- "@ckeditor/ckeditor5-table": "^38.0.1",
42
- "@ckeditor/ckeditor5-theme-lark": "^38.0.1",
43
- "@ckeditor/ckeditor5-typing": "^38.0.1",
44
- "@ckeditor/ckeditor5-undo": "^38.0.1",
45
- "@ckeditor/ckeditor5-upload": "^38.0.1",
46
- "@ckeditor/ckeditor5-utils": "^38.0.1",
47
- "@ckeditor/ckeditor5-watchdog": "^38.0.1",
48
- "@ckeditor/ckeditor5-widget": "^38.0.1",
49
- "typescript": "^4.8.4",
50
- "webpack": "^5.58.1",
51
- "webpack-cli": "^4.9.0"
52
- },
53
19
  "engines": {
54
20
  "node": ">=16.0.0",
55
21
  "npm": ">=5.7.1"
@@ -72,10 +38,5 @@
72
38
  "ckeditor5-metadata.json",
73
39
  "CHANGELOG.md"
74
40
  ],
75
- "scripts": {
76
- "dll:build": "webpack",
77
- "build": "tsc -p ./tsconfig.json",
78
- "postversion": "npm run build"
79
- },
80
41
  "types": "src/index.d.ts"
81
42
  }
@@ -1,55 +1,55 @@
1
- /**
2
- * @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
3
- * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
4
- */
5
- import type { ImageConfig, AutoImage, Image, ImageBlock, ImageCaption, ImageInline, ImageInsert, ImageInsertViaUrl, ImageResize, ImageStyle, ImageTextAlternative, ImageToolbar, ImageUpload, ImageUtils, ImageBlockEditing, ImageEditing, ImageCaptionEditing, ImageCaptionUI, ImageCaptionUtils, ImageInsertUI, ImageResizeEditing, ImageStyleEditing, ImageStyleUI, ImageTextAlternativeEditing, ImageTextAlternativeUI, ImageUploadEditing, ImageUploadProgress, ImageUploadUI, ImageTypeCommand, InsertImageCommand, ReplaceImageSourceCommand, ToggleImageCaptionCommand, ResizeImageCommand, ImageStyleCommand, ImageTextAlternativeCommand, UploadImageCommand } from '.';
6
- declare module '@ckeditor/ckeditor5-core' {
7
- interface EditorConfig {
8
- /**
9
- * The configuration of the image features. Used by the image features in the `@ckeditor/ckeditor5-image` package.
10
- *
11
- * Read more in {@link module:image/imageconfig~ImageConfig}.
12
- */
13
- image?: ImageConfig;
14
- }
15
- interface PluginsMap {
16
- [AutoImage.pluginName]: AutoImage;
17
- [Image.pluginName]: Image;
18
- [ImageBlock.pluginName]: ImageBlock;
19
- [ImageCaption.pluginName]: ImageCaption;
20
- [ImageInline.pluginName]: ImageInline;
21
- [ImageInsert.pluginName]: ImageInsert;
22
- [ImageInsertViaUrl.pluginName]: ImageInsertViaUrl;
23
- [ImageResize.pluginName]: ImageResize;
24
- [ImageStyle.pluginName]: ImageStyle;
25
- [ImageTextAlternative.pluginName]: ImageTextAlternative;
26
- [ImageToolbar.pluginName]: ImageToolbar;
27
- [ImageUpload.pluginName]: ImageUpload;
28
- [ImageUtils.pluginName]: ImageUtils;
29
- [ImageBlockEditing.pluginName]: ImageBlockEditing;
30
- [ImageEditing.pluginName]: ImageEditing;
31
- [ImageCaptionEditing.pluginName]: ImageCaptionEditing;
32
- [ImageCaptionUI.pluginName]: ImageCaptionUI;
33
- [ImageCaptionUtils.pluginName]: ImageCaptionUtils;
34
- [ImageInsertUI.pluginName]: ImageInsertUI;
35
- [ImageResizeEditing.pluginName]: ImageResizeEditing;
36
- [ImageStyleEditing.pluginName]: ImageStyleEditing;
37
- [ImageStyleUI.pluginName]: ImageStyleUI;
38
- [ImageTextAlternativeEditing.pluginName]: ImageTextAlternativeEditing;
39
- [ImageTextAlternativeUI.pluginName]: ImageTextAlternativeUI;
40
- [ImageUploadEditing.pluginName]: ImageUploadEditing;
41
- [ImageUploadProgress.pluginName]: ImageUploadProgress;
42
- [ImageUploadUI.pluginName]: ImageUploadUI;
43
- }
44
- interface CommandsMap {
45
- imageTypeBlock: ImageTypeCommand;
46
- imageTypeInline: ImageTypeCommand;
47
- insertImage: InsertImageCommand;
48
- replaceImageSource: ReplaceImageSourceCommand;
49
- toggleImageCaption: ToggleImageCaptionCommand;
50
- resizeImage: ResizeImageCommand;
51
- imageStyle: ImageStyleCommand;
52
- imageTextAlternative: ImageTextAlternativeCommand;
53
- uploadImage: UploadImageCommand;
54
- }
55
- }
1
+ /**
2
+ * @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
3
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
4
+ */
5
+ import type { ImageConfig, AutoImage, Image, ImageBlock, ImageCaption, ImageInline, ImageInsert, ImageInsertViaUrl, ImageResize, ImageStyle, ImageTextAlternative, ImageToolbar, ImageUpload, ImageUtils, ImageBlockEditing, ImageEditing, ImageCaptionEditing, ImageCaptionUI, ImageCaptionUtils, ImageInsertUI, ImageResizeEditing, ImageStyleEditing, ImageStyleUI, ImageTextAlternativeEditing, ImageTextAlternativeUI, ImageUploadEditing, ImageUploadProgress, ImageUploadUI, ImageTypeCommand, InsertImageCommand, ReplaceImageSourceCommand, ToggleImageCaptionCommand, ResizeImageCommand, ImageStyleCommand, ImageTextAlternativeCommand, UploadImageCommand } from '.';
6
+ declare module '@ckeditor/ckeditor5-core' {
7
+ interface EditorConfig {
8
+ /**
9
+ * The configuration of the image features. Used by the image features in the `@ckeditor/ckeditor5-image` package.
10
+ *
11
+ * Read more in {@link module:image/imageconfig~ImageConfig}.
12
+ */
13
+ image?: ImageConfig;
14
+ }
15
+ interface PluginsMap {
16
+ [AutoImage.pluginName]: AutoImage;
17
+ [Image.pluginName]: Image;
18
+ [ImageBlock.pluginName]: ImageBlock;
19
+ [ImageCaption.pluginName]: ImageCaption;
20
+ [ImageInline.pluginName]: ImageInline;
21
+ [ImageInsert.pluginName]: ImageInsert;
22
+ [ImageInsertViaUrl.pluginName]: ImageInsertViaUrl;
23
+ [ImageResize.pluginName]: ImageResize;
24
+ [ImageStyle.pluginName]: ImageStyle;
25
+ [ImageTextAlternative.pluginName]: ImageTextAlternative;
26
+ [ImageToolbar.pluginName]: ImageToolbar;
27
+ [ImageUpload.pluginName]: ImageUpload;
28
+ [ImageUtils.pluginName]: ImageUtils;
29
+ [ImageBlockEditing.pluginName]: ImageBlockEditing;
30
+ [ImageEditing.pluginName]: ImageEditing;
31
+ [ImageCaptionEditing.pluginName]: ImageCaptionEditing;
32
+ [ImageCaptionUI.pluginName]: ImageCaptionUI;
33
+ [ImageCaptionUtils.pluginName]: ImageCaptionUtils;
34
+ [ImageInsertUI.pluginName]: ImageInsertUI;
35
+ [ImageResizeEditing.pluginName]: ImageResizeEditing;
36
+ [ImageStyleEditing.pluginName]: ImageStyleEditing;
37
+ [ImageStyleUI.pluginName]: ImageStyleUI;
38
+ [ImageTextAlternativeEditing.pluginName]: ImageTextAlternativeEditing;
39
+ [ImageTextAlternativeUI.pluginName]: ImageTextAlternativeUI;
40
+ [ImageUploadEditing.pluginName]: ImageUploadEditing;
41
+ [ImageUploadProgress.pluginName]: ImageUploadProgress;
42
+ [ImageUploadUI.pluginName]: ImageUploadUI;
43
+ }
44
+ interface CommandsMap {
45
+ imageTypeBlock: ImageTypeCommand;
46
+ imageTypeInline: ImageTypeCommand;
47
+ insertImage: InsertImageCommand;
48
+ replaceImageSource: ReplaceImageSourceCommand;
49
+ toggleImageCaption: ToggleImageCaptionCommand;
50
+ resizeImage: ResizeImageCommand;
51
+ imageStyle: ImageStyleCommand;
52
+ imageTextAlternative: ImageTextAlternativeCommand;
53
+ uploadImage: UploadImageCommand;
54
+ }
55
+ }
@@ -1,5 +1,5 @@
1
- /**
2
- * @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
3
- * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
4
- */
5
- export {};
1
+ /**
2
+ * @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
3
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
4
+ */
5
+ export {};
@@ -1,52 +1,52 @@
1
- /**
2
- * @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
3
- * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
4
- */
5
- /**
6
- * @module image/autoimage
7
- */
8
- import { Plugin, type Editor } from 'ckeditor5/src/core';
9
- import { Clipboard } from 'ckeditor5/src/clipboard';
10
- import { Undo } from 'ckeditor5/src/undo';
11
- import { Delete } from 'ckeditor5/src/typing';
12
- import ImageUtils from './imageutils';
13
- /**
14
- * The auto-image plugin. It recognizes image links in the pasted content and embeds
15
- * them shortly after they are injected into the document.
16
- */
17
- export default class AutoImage extends Plugin {
18
- /**
19
- * @inheritDoc
20
- */
21
- static get requires(): readonly [typeof Clipboard, typeof ImageUtils, typeof Undo, typeof Delete];
22
- /**
23
- * @inheritDoc
24
- */
25
- static get pluginName(): 'AutoImage';
26
- /**
27
- * The paste–to–embed `setTimeout` ID. Stored as a property to allow
28
- * cleaning of the timeout.
29
- */
30
- private _timeoutId;
31
- /**
32
- * The position where the `<imageBlock>` element will be inserted after the timeout,
33
- * determined each time a new content is pasted into the document.
34
- */
35
- private _positionToInsert;
36
- /**
37
- * @inheritDoc
38
- */
39
- constructor(editor: Editor);
40
- /**
41
- * @inheritDoc
42
- */
43
- init(): void;
44
- /**
45
- * Analyzes the part of the document between provided positions in search for a URL representing an image.
46
- * When the URL is found, it is automatically converted into an image.
47
- *
48
- * @param leftPosition Left position of the selection.
49
- * @param rightPosition Right position of the selection.
50
- */
51
- private _embedImageBetweenPositions;
52
- }
1
+ /**
2
+ * @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
3
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
4
+ */
5
+ /**
6
+ * @module image/autoimage
7
+ */
8
+ import { Plugin, type Editor } from 'ckeditor5/src/core';
9
+ import { Clipboard } from 'ckeditor5/src/clipboard';
10
+ import { Undo } from 'ckeditor5/src/undo';
11
+ import { Delete } from 'ckeditor5/src/typing';
12
+ import ImageUtils from './imageutils';
13
+ /**
14
+ * The auto-image plugin. It recognizes image links in the pasted content and embeds
15
+ * them shortly after they are injected into the document.
16
+ */
17
+ export default class AutoImage extends Plugin {
18
+ /**
19
+ * @inheritDoc
20
+ */
21
+ static get requires(): readonly [typeof Clipboard, typeof ImageUtils, typeof Undo, typeof Delete];
22
+ /**
23
+ * @inheritDoc
24
+ */
25
+ static get pluginName(): "AutoImage";
26
+ /**
27
+ * The paste–to–embed `setTimeout` ID. Stored as a property to allow
28
+ * cleaning of the timeout.
29
+ */
30
+ private _timeoutId;
31
+ /**
32
+ * The position where the `<imageBlock>` element will be inserted after the timeout,
33
+ * determined each time a new content is pasted into the document.
34
+ */
35
+ private _positionToInsert;
36
+ /**
37
+ * @inheritDoc
38
+ */
39
+ constructor(editor: Editor);
40
+ /**
41
+ * @inheritDoc
42
+ */
43
+ init(): void;
44
+ /**
45
+ * Analyzes the part of the document between provided positions in search for a URL representing an image.
46
+ * When the URL is found, it is automatically converted into an image.
47
+ *
48
+ * @param leftPosition Left position of the selection.
49
+ * @param rightPosition Right position of the selection.
50
+ */
51
+ private _embedImageBetweenPositions;
52
+ }
package/src/autoimage.js CHANGED
@@ -1,132 +1,132 @@
1
- /**
2
- * @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
3
- * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
4
- */
5
- /**
6
- * @module image/autoimage
7
- */
8
- import { Plugin } from 'ckeditor5/src/core';
9
- import { Clipboard } from 'ckeditor5/src/clipboard';
10
- import { LivePosition, LiveRange } from 'ckeditor5/src/engine';
11
- import { Undo } from 'ckeditor5/src/undo';
12
- import { Delete } from 'ckeditor5/src/typing';
13
- import { global } from 'ckeditor5/src/utils';
14
- import ImageUtils from './imageutils';
15
- // Implements the pattern: http(s)://(www.)example.com/path/to/resource.ext?query=params&maybe=too.
16
- const IMAGE_URL_REGEXP = new RegExp(String(/^(http(s)?:\/\/)?[\w-]+\.[\w.~:/[\]@!$&'()*+,;=%-]+/.source +
17
- /\.(jpg|jpeg|png|gif|ico|webp|JPG|JPEG|PNG|GIF|ICO|WEBP)/.source +
18
- /(\?[\w.~:/[\]@!$&'()*+,;=%-]*)?/.source +
19
- /(#[\w.~:/[\]@!$&'()*+,;=%-]*)?$/.source));
20
- /**
21
- * The auto-image plugin. It recognizes image links in the pasted content and embeds
22
- * them shortly after they are injected into the document.
23
- */
24
- export default class AutoImage extends Plugin {
25
- /**
26
- * @inheritDoc
27
- */
28
- static get requires() {
29
- return [Clipboard, ImageUtils, Undo, Delete];
30
- }
31
- /**
32
- * @inheritDoc
33
- */
34
- static get pluginName() {
35
- return 'AutoImage';
36
- }
37
- /**
38
- * @inheritDoc
39
- */
40
- constructor(editor) {
41
- super(editor);
42
- this._timeoutId = null;
43
- this._positionToInsert = null;
44
- }
45
- /**
46
- * @inheritDoc
47
- */
48
- init() {
49
- const editor = this.editor;
50
- const modelDocument = editor.model.document;
51
- const clipboardPipeline = editor.plugins.get('ClipboardPipeline');
52
- // We need to listen on `Clipboard#inputTransformation` because we need to save positions of selection.
53
- // After pasting, the content between those positions will be checked for a URL that could be transformed
54
- // into an image.
55
- this.listenTo(clipboardPipeline, 'inputTransformation', () => {
56
- const firstRange = modelDocument.selection.getFirstRange();
57
- const leftLivePosition = LivePosition.fromPosition(firstRange.start);
58
- leftLivePosition.stickiness = 'toPrevious';
59
- const rightLivePosition = LivePosition.fromPosition(firstRange.end);
60
- rightLivePosition.stickiness = 'toNext';
61
- modelDocument.once('change:data', () => {
62
- this._embedImageBetweenPositions(leftLivePosition, rightLivePosition);
63
- leftLivePosition.detach();
64
- rightLivePosition.detach();
65
- }, { priority: 'high' });
66
- });
67
- editor.commands.get('undo').on('execute', () => {
68
- if (this._timeoutId) {
69
- global.window.clearTimeout(this._timeoutId);
70
- this._positionToInsert.detach();
71
- this._timeoutId = null;
72
- this._positionToInsert = null;
73
- }
74
- }, { priority: 'high' });
75
- }
76
- /**
77
- * Analyzes the part of the document between provided positions in search for a URL representing an image.
78
- * When the URL is found, it is automatically converted into an image.
79
- *
80
- * @param leftPosition Left position of the selection.
81
- * @param rightPosition Right position of the selection.
82
- */
83
- _embedImageBetweenPositions(leftPosition, rightPosition) {
84
- const editor = this.editor;
85
- // TODO: Use a marker instead of LiveRange & LivePositions.
86
- const urlRange = new LiveRange(leftPosition, rightPosition);
87
- const walker = urlRange.getWalker({ ignoreElementEnd: true });
88
- const selectionAttributes = Object.fromEntries(editor.model.document.selection.getAttributes());
89
- const imageUtils = this.editor.plugins.get('ImageUtils');
90
- let src = '';
91
- for (const node of walker) {
92
- if (node.item.is('$textProxy')) {
93
- src += node.item.data;
94
- }
95
- }
96
- src = src.trim();
97
- // If the URL does not match the image URL regexp, let's skip that.
98
- if (!src.match(IMAGE_URL_REGEXP)) {
99
- urlRange.detach();
100
- return;
101
- }
102
- // Position will not be available in the `setTimeout` function so let's clone it.
103
- this._positionToInsert = LivePosition.fromPosition(leftPosition);
104
- // This action mustn't be executed if undo was called between pasting and auto-embedding.
105
- this._timeoutId = setTimeout(() => {
106
- // Do nothing if image element cannot be inserted at the current position.
107
- // See https://github.com/ckeditor/ckeditor5/issues/2763.
108
- // Condition must be checked after timeout - pasting may take place on an element, replacing it. The final position matters.
109
- const imageCommand = editor.commands.get('insertImage');
110
- if (!imageCommand.isEnabled) {
111
- urlRange.detach();
112
- return;
113
- }
114
- editor.model.change(writer => {
115
- this._timeoutId = null;
116
- writer.remove(urlRange);
117
- urlRange.detach();
118
- let insertionPosition;
119
- // Check if the position where the element should be inserted is still valid.
120
- // Otherwise leave it as undefined to use the logic of insertImage().
121
- if (this._positionToInsert.root.rootName !== '$graveyard') {
122
- insertionPosition = this._positionToInsert.toPosition();
123
- }
124
- imageUtils.insertImage({ ...selectionAttributes, src }, insertionPosition);
125
- this._positionToInsert.detach();
126
- this._positionToInsert = null;
127
- });
128
- const deletePlugin = editor.plugins.get('Delete');
129
- deletePlugin.requestUndoOnBackspace();
130
- }, 100);
131
- }
132
- }
1
+ /**
2
+ * @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
3
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
4
+ */
5
+ /**
6
+ * @module image/autoimage
7
+ */
8
+ import { Plugin } from 'ckeditor5/src/core';
9
+ import { Clipboard } from 'ckeditor5/src/clipboard';
10
+ import { LivePosition, LiveRange } from 'ckeditor5/src/engine';
11
+ import { Undo } from 'ckeditor5/src/undo';
12
+ import { Delete } from 'ckeditor5/src/typing';
13
+ import { global } from 'ckeditor5/src/utils';
14
+ import ImageUtils from './imageutils';
15
+ // Implements the pattern: http(s)://(www.)example.com/path/to/resource.ext?query=params&maybe=too.
16
+ const IMAGE_URL_REGEXP = new RegExp(String(/^(http(s)?:\/\/)?[\w-]+\.[\w.~:/[\]@!$&'()*+,;=%-]+/.source +
17
+ /\.(jpg|jpeg|png|gif|ico|webp|JPG|JPEG|PNG|GIF|ICO|WEBP)/.source +
18
+ /(\?[\w.~:/[\]@!$&'()*+,;=%-]*)?/.source +
19
+ /(#[\w.~:/[\]@!$&'()*+,;=%-]*)?$/.source));
20
+ /**
21
+ * The auto-image plugin. It recognizes image links in the pasted content and embeds
22
+ * them shortly after they are injected into the document.
23
+ */
24
+ export default class AutoImage extends Plugin {
25
+ /**
26
+ * @inheritDoc
27
+ */
28
+ static get requires() {
29
+ return [Clipboard, ImageUtils, Undo, Delete];
30
+ }
31
+ /**
32
+ * @inheritDoc
33
+ */
34
+ static get pluginName() {
35
+ return 'AutoImage';
36
+ }
37
+ /**
38
+ * @inheritDoc
39
+ */
40
+ constructor(editor) {
41
+ super(editor);
42
+ this._timeoutId = null;
43
+ this._positionToInsert = null;
44
+ }
45
+ /**
46
+ * @inheritDoc
47
+ */
48
+ init() {
49
+ const editor = this.editor;
50
+ const modelDocument = editor.model.document;
51
+ const clipboardPipeline = editor.plugins.get('ClipboardPipeline');
52
+ // We need to listen on `Clipboard#inputTransformation` because we need to save positions of selection.
53
+ // After pasting, the content between those positions will be checked for a URL that could be transformed
54
+ // into an image.
55
+ this.listenTo(clipboardPipeline, 'inputTransformation', () => {
56
+ const firstRange = modelDocument.selection.getFirstRange();
57
+ const leftLivePosition = LivePosition.fromPosition(firstRange.start);
58
+ leftLivePosition.stickiness = 'toPrevious';
59
+ const rightLivePosition = LivePosition.fromPosition(firstRange.end);
60
+ rightLivePosition.stickiness = 'toNext';
61
+ modelDocument.once('change:data', () => {
62
+ this._embedImageBetweenPositions(leftLivePosition, rightLivePosition);
63
+ leftLivePosition.detach();
64
+ rightLivePosition.detach();
65
+ }, { priority: 'high' });
66
+ });
67
+ editor.commands.get('undo').on('execute', () => {
68
+ if (this._timeoutId) {
69
+ global.window.clearTimeout(this._timeoutId);
70
+ this._positionToInsert.detach();
71
+ this._timeoutId = null;
72
+ this._positionToInsert = null;
73
+ }
74
+ }, { priority: 'high' });
75
+ }
76
+ /**
77
+ * Analyzes the part of the document between provided positions in search for a URL representing an image.
78
+ * When the URL is found, it is automatically converted into an image.
79
+ *
80
+ * @param leftPosition Left position of the selection.
81
+ * @param rightPosition Right position of the selection.
82
+ */
83
+ _embedImageBetweenPositions(leftPosition, rightPosition) {
84
+ const editor = this.editor;
85
+ // TODO: Use a marker instead of LiveRange & LivePositions.
86
+ const urlRange = new LiveRange(leftPosition, rightPosition);
87
+ const walker = urlRange.getWalker({ ignoreElementEnd: true });
88
+ const selectionAttributes = Object.fromEntries(editor.model.document.selection.getAttributes());
89
+ const imageUtils = this.editor.plugins.get('ImageUtils');
90
+ let src = '';
91
+ for (const node of walker) {
92
+ if (node.item.is('$textProxy')) {
93
+ src += node.item.data;
94
+ }
95
+ }
96
+ src = src.trim();
97
+ // If the URL does not match the image URL regexp, let's skip that.
98
+ if (!src.match(IMAGE_URL_REGEXP)) {
99
+ urlRange.detach();
100
+ return;
101
+ }
102
+ // Position will not be available in the `setTimeout` function so let's clone it.
103
+ this._positionToInsert = LivePosition.fromPosition(leftPosition);
104
+ // This action mustn't be executed if undo was called between pasting and auto-embedding.
105
+ this._timeoutId = setTimeout(() => {
106
+ // Do nothing if image element cannot be inserted at the current position.
107
+ // See https://github.com/ckeditor/ckeditor5/issues/2763.
108
+ // Condition must be checked after timeout - pasting may take place on an element, replacing it. The final position matters.
109
+ const imageCommand = editor.commands.get('insertImage');
110
+ if (!imageCommand.isEnabled) {
111
+ urlRange.detach();
112
+ return;
113
+ }
114
+ editor.model.change(writer => {
115
+ this._timeoutId = null;
116
+ writer.remove(urlRange);
117
+ urlRange.detach();
118
+ let insertionPosition;
119
+ // Check if the position where the element should be inserted is still valid.
120
+ // Otherwise leave it as undefined to use the logic of insertImage().
121
+ if (this._positionToInsert.root.rootName !== '$graveyard') {
122
+ insertionPosition = this._positionToInsert.toPosition();
123
+ }
124
+ imageUtils.insertImage({ ...selectionAttributes, src }, insertionPosition);
125
+ this._positionToInsert.detach();
126
+ this._positionToInsert = null;
127
+ });
128
+ const deletePlugin = editor.plugins.get('Delete');
129
+ deletePlugin.requestUndoOnBackspace();
130
+ }, 100);
131
+ }
132
+ }