@ckeditor/ckeditor5-minimap 48.2.0 → 48.3.0-alpha.0
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.
- package/dist/augmentation.d.ts +16 -16
- package/dist/index.css.map +1 -1
- package/dist/index.d.ts +12 -12
- package/dist/index.js +505 -490
- package/dist/index.js.map +1 -1
- package/dist/minimap.d.ts +53 -53
- package/dist/minimapconfig.d.ts +81 -81
- package/dist/minimapiframeview.d.ts +49 -49
- package/dist/minimappositiontrackerview.d.ts +53 -53
- package/dist/minimapview.d.ts +100 -100
- package/dist/utils.d.ts +48 -48
- package/package.json +5 -5
package/dist/minimapconfig.d.ts
CHANGED
|
@@ -1,86 +1,86 @@
|
|
|
1
1
|
/**
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
2
|
+
* @license Copyright (c) 2003-2026, CKSource Holding sp. z o.o. All rights reserved.
|
|
3
|
+
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
|
|
4
|
+
*/
|
|
5
5
|
/**
|
|
6
|
-
|
|
7
|
-
|
|
6
|
+
* @module minimap/minimapconfig
|
|
7
|
+
*/
|
|
8
8
|
/**
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
9
|
+
* The configuration of the {@link module:minimap/minimap~Minimap} feature.
|
|
10
|
+
*
|
|
11
|
+
* ```ts
|
|
12
|
+
* ClassicEditor
|
|
13
|
+
* .create( {
|
|
14
|
+
* minimap: ... // Minimap feature config.
|
|
15
|
+
* } )
|
|
16
|
+
* .then( ... )
|
|
17
|
+
* .catch( ... );
|
|
18
|
+
* ```
|
|
19
|
+
*
|
|
20
|
+
* See {@link module:core/editor/editorconfig~EditorConfig all editor options}.
|
|
21
|
+
*/
|
|
22
22
|
export interface MinimapConfig {
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
23
|
+
/**
|
|
24
|
+
* The DOM element container for the minimap.
|
|
25
|
+
*
|
|
26
|
+
* **Note**: The container must have a fixed `width` and `overflow: hidden` for the minimap to work correctly.
|
|
27
|
+
*/
|
|
28
|
+
container: HTMLElement;
|
|
29
|
+
/**
|
|
30
|
+
* When set to `true`, the minimap will render content as simple boxes instead of replicating the look of the content (default).
|
|
31
|
+
*/
|
|
32
|
+
useSimplePreview?: boolean;
|
|
33
|
+
/**
|
|
34
|
+
* Extra CSS class (or classes) that will be set internally on the `<body>` element of the `<iframe>` enclosing the minimap.
|
|
35
|
+
*
|
|
36
|
+
* By default, the minimap feature will attempt to clone all website styles and re-apply them in the `<iframe>` for the best accuracy.
|
|
37
|
+
* However, this may not work if the content of your editor inherits the styles from parent containers, resulting in inconsistent
|
|
38
|
+
* look and imprecise scrolling of the minimap.
|
|
39
|
+
*
|
|
40
|
+
* This optional configuration can address these issues by ensuring the same CSS rules apply to the content of the minimap
|
|
41
|
+
* and the original content of the editor.
|
|
42
|
+
*
|
|
43
|
+
* For instance, consider the following DOM structure:
|
|
44
|
+
*
|
|
45
|
+
* ```html
|
|
46
|
+
* <div class="website">
|
|
47
|
+
* <!-- ... -->
|
|
48
|
+
* <div class="styled-container">
|
|
49
|
+
* <!-- ... -->
|
|
50
|
+
* <div id="editor">
|
|
51
|
+
* <!-- content of the editor -->
|
|
52
|
+
* </div>
|
|
53
|
+
* </div>
|
|
54
|
+
* <!-- ... -->
|
|
55
|
+
* </div>
|
|
56
|
+
* ```
|
|
57
|
+
*
|
|
58
|
+
* and the following CSS styles:
|
|
59
|
+
*
|
|
60
|
+
* ```css
|
|
61
|
+
* .website p {
|
|
62
|
+
* font-size: 13px;
|
|
63
|
+
* }
|
|
64
|
+
*
|
|
65
|
+
* .styled-container p {
|
|
66
|
+
* color: #ccc;
|
|
67
|
+
* }
|
|
68
|
+
* ```
|
|
69
|
+
*
|
|
70
|
+
* To maintain the consistency of styling (`font-size` and `color` of paragraphs), you will need to pass the CSS class names
|
|
71
|
+
* of these containers:
|
|
72
|
+
*
|
|
73
|
+
* ```ts
|
|
74
|
+
* ClassicEditor
|
|
75
|
+
* .create( {
|
|
76
|
+
* attachTo: document.getElementById( 'editor' ),
|
|
77
|
+
* minimap: {
|
|
78
|
+
* extraClasses: 'website styled-container'
|
|
79
|
+
* }
|
|
80
|
+
* } )
|
|
81
|
+
* .then( ... )
|
|
82
|
+
* .catch( ... );
|
|
83
|
+
* ```
|
|
84
|
+
*/
|
|
85
|
+
extraClasses?: string;
|
|
86
86
|
}
|
|
@@ -1,54 +1,54 @@
|
|
|
1
1
|
/**
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
2
|
+
* @license Copyright (c) 2003-2026, CKSource Holding sp. z o.o. All rights reserved.
|
|
3
|
+
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
|
|
4
|
+
*/
|
|
5
5
|
/**
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
import { IframeView } from
|
|
9
|
-
import { type Locale } from
|
|
10
|
-
import type { MinimapViewOptions } from
|
|
6
|
+
* @module minimap/minimapiframeview
|
|
7
|
+
*/
|
|
8
|
+
import { IframeView } from "@ckeditor/ckeditor5-ui";
|
|
9
|
+
import { type Locale } from "@ckeditor/ckeditor5-utils";
|
|
10
|
+
import type { MinimapViewOptions } from "./minimapview.js";
|
|
11
11
|
/**
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
12
|
+
* The internal `<iframe>` view that hosts the minimap content.
|
|
13
|
+
*
|
|
14
|
+
* @internal
|
|
15
|
+
*/
|
|
16
16
|
export declare class MinimapIframeView extends IframeView {
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
17
|
+
/**
|
|
18
|
+
* The CSS `top` used to scroll the minimap.
|
|
19
|
+
*
|
|
20
|
+
* @readonly
|
|
21
|
+
*/
|
|
22
|
+
top: number;
|
|
23
|
+
/**
|
|
24
|
+
* The CSS `height` of the iframe.
|
|
25
|
+
*
|
|
26
|
+
* @readonly
|
|
27
|
+
*/
|
|
28
|
+
height: number;
|
|
29
|
+
/**
|
|
30
|
+
* Cached view constructor options for re-use in other methods.
|
|
31
|
+
*/
|
|
32
|
+
private readonly _options;
|
|
33
|
+
/**
|
|
34
|
+
* Creates an instance of the internal minimap iframe.
|
|
35
|
+
*/
|
|
36
|
+
constructor(locale: Locale, options: MinimapViewOptions);
|
|
37
|
+
/**
|
|
38
|
+
* @inheritDoc
|
|
39
|
+
*/
|
|
40
|
+
override render(): Promise<unknown>;
|
|
41
|
+
/**
|
|
42
|
+
* Sets the new height of the iframe.
|
|
43
|
+
*/
|
|
44
|
+
setHeight(newHeight: number): void;
|
|
45
|
+
/**
|
|
46
|
+
* Sets the top offset of the iframe to move it around vertically.
|
|
47
|
+
*/
|
|
48
|
+
setTopOffset(newOffset: number): void;
|
|
49
|
+
/**
|
|
50
|
+
* Sets the internal structure of the `<iframe>` readying it to display the
|
|
51
|
+
* minimap element.
|
|
52
|
+
*/
|
|
53
|
+
private _prepareDocument;
|
|
54
54
|
}
|
|
@@ -1,58 +1,58 @@
|
|
|
1
1
|
/**
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
2
|
+
* @license Copyright (c) 2003-2026, CKSource Holding sp. z o.o. All rights reserved.
|
|
3
|
+
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
|
|
4
|
+
*/
|
|
5
5
|
/**
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
import { View } from
|
|
9
|
-
import { type Locale } from
|
|
6
|
+
* @module minimap/minimappositiontrackerview
|
|
7
|
+
*/
|
|
8
|
+
import { View } from "@ckeditor/ckeditor5-ui";
|
|
9
|
+
import { type Locale } from "@ckeditor/ckeditor5-utils";
|
|
10
10
|
/**
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
11
|
+
* The position tracker visualizing the visible subset of the content. Displayed over the minimap.
|
|
12
|
+
*
|
|
13
|
+
* @internal
|
|
14
|
+
*/
|
|
15
15
|
export declare class MinimapPositionTrackerView extends View {
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
16
|
+
/**
|
|
17
|
+
* The CSS `height` of the tracker visualizing the subset of the content visible to the user.
|
|
18
|
+
*
|
|
19
|
+
* @readonly
|
|
20
|
+
*/
|
|
21
|
+
height: number;
|
|
22
|
+
/**
|
|
23
|
+
* The CSS `top` of the tracker, used to move it vertically over the minimap.
|
|
24
|
+
*
|
|
25
|
+
* @readonly
|
|
26
|
+
*/
|
|
27
|
+
top: number;
|
|
28
|
+
/**
|
|
29
|
+
* The scroll progress (in %) displayed over the tracker when being dragged by the user.
|
|
30
|
+
*
|
|
31
|
+
* @readonly
|
|
32
|
+
*/
|
|
33
|
+
scrollProgress: number;
|
|
34
|
+
/**
|
|
35
|
+
* Indicates whether the tracker is being dragged by the user (e.g. using the mouse).
|
|
36
|
+
*
|
|
37
|
+
* @internal
|
|
38
|
+
* @readonly
|
|
39
|
+
*/
|
|
40
|
+
_isDragging: boolean;
|
|
41
|
+
constructor(locale: Locale);
|
|
42
|
+
/**
|
|
43
|
+
* @inheritDoc
|
|
44
|
+
*/
|
|
45
|
+
override render(): void;
|
|
46
|
+
/**
|
|
47
|
+
* Sets the new height of the tracker to visualize the subset of the content visible to the user.
|
|
48
|
+
*/
|
|
49
|
+
setHeight(newHeight: number): void;
|
|
50
|
+
/**
|
|
51
|
+
* Sets the top offset of the tracker to move it around vertically.
|
|
52
|
+
*/
|
|
53
|
+
setTopOffset(newOffset: number): void;
|
|
54
|
+
/**
|
|
55
|
+
* Sets the scroll progress (in %) to inform the user using a label when the tracker is being dragged.
|
|
56
|
+
*/
|
|
57
|
+
setScrollProgress(newProgress: number): void;
|
|
58
58
|
}
|
package/dist/minimapview.d.ts
CHANGED
|
@@ -1,114 +1,114 @@
|
|
|
1
1
|
/**
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
2
|
+
* @license Copyright (c) 2003-2026, CKSource Holding sp. z o.o. All rights reserved.
|
|
3
|
+
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
|
|
4
|
+
*/
|
|
5
5
|
/**
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
import { View } from
|
|
9
|
-
import { type Locale } from
|
|
6
|
+
* @module minimap/minimapview
|
|
7
|
+
*/
|
|
8
|
+
import { View } from "@ckeditor/ckeditor5-ui";
|
|
9
|
+
import { type Locale } from "@ckeditor/ckeditor5-utils";
|
|
10
10
|
/**
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
11
|
+
* Options for the minimap view.
|
|
12
|
+
*
|
|
13
|
+
* @internal
|
|
14
|
+
*/
|
|
15
15
|
export type MinimapViewOptions = {
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
16
|
+
domRootClone: HTMLElement;
|
|
17
|
+
pageStyles: Array<string | {
|
|
18
|
+
href: string;
|
|
19
|
+
}>;
|
|
20
|
+
scaleRatio: number;
|
|
21
|
+
useSimplePreview?: boolean;
|
|
22
|
+
extraClasses?: string;
|
|
23
23
|
};
|
|
24
24
|
/**
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
25
|
+
* The main view of the minimap. It renders the original content but scaled down with a tracker element
|
|
26
|
+
* visualizing the subset of the content visible to the user and allowing interactions (scrolling, dragging).
|
|
27
|
+
*
|
|
28
|
+
* @internal
|
|
29
|
+
*/
|
|
30
30
|
export declare class MinimapView extends View {
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
31
|
+
/**
|
|
32
|
+
* An instance of the tracker view displayed over the minimap.
|
|
33
|
+
*/
|
|
34
|
+
private readonly _positionTrackerView;
|
|
35
|
+
/**
|
|
36
|
+
* The scale ratio of the minimap relative to the original editing DOM root with the content.
|
|
37
|
+
*/
|
|
38
|
+
private readonly _scaleRatio;
|
|
39
|
+
/**
|
|
40
|
+
* An instance of the iframe view that hosts the minimap.
|
|
41
|
+
*/
|
|
42
|
+
private readonly _minimapIframeView;
|
|
43
|
+
/**
|
|
44
|
+
* Creates an instance of the minimap view.
|
|
45
|
+
*/
|
|
46
|
+
constructor({ locale, scaleRatio, pageStyles, extraClasses, useSimplePreview, domRootClone }: {
|
|
47
|
+
locale: Locale;
|
|
48
|
+
} & MinimapViewOptions);
|
|
49
|
+
/**
|
|
50
|
+
* @inheritDoc
|
|
51
|
+
*/
|
|
52
|
+
override destroy(): void;
|
|
53
|
+
/**
|
|
54
|
+
* Returns the DOM {@link module:utils/dom/rect~Rect} height of the minimap.
|
|
55
|
+
*/
|
|
56
|
+
get height(): number;
|
|
57
|
+
/**
|
|
58
|
+
* Returns the number of available space (pixels) the position tracker (visible subset of the content) can use to scroll vertically.
|
|
59
|
+
*/
|
|
60
|
+
get scrollHeight(): number;
|
|
61
|
+
/**
|
|
62
|
+
* @inheritDoc
|
|
63
|
+
*/
|
|
64
|
+
override render(): void;
|
|
65
|
+
/**
|
|
66
|
+
* Sets the new height of the minimap (in px) to respond to the changes in the original editing DOM root.
|
|
67
|
+
*
|
|
68
|
+
* **Note**:The provided value should be the `offsetHeight` of the original editing DOM root.
|
|
69
|
+
*/
|
|
70
|
+
setContentHeight(newHeight: number): void;
|
|
71
|
+
/**
|
|
72
|
+
* Sets the minimap scroll progress.
|
|
73
|
+
*
|
|
74
|
+
* The minimap scroll progress is linked to the original editing DOM root and its scrollable container (ancestor).
|
|
75
|
+
* Changing the progress will alter the vertical position of the minimap (and its position tracker) and give the user an accurate
|
|
76
|
+
* overview of the visible document.
|
|
77
|
+
*
|
|
78
|
+
* **Note**: The value should be between 0 and 1. 0 when the DOM root has not been scrolled, 1 when the
|
|
79
|
+
* scrolling has reached the end.
|
|
80
|
+
*/
|
|
81
|
+
setScrollProgress(newScrollProgress: number): void;
|
|
82
|
+
/**
|
|
83
|
+
* Sets the new height of the tracker (in px) to visualize the subset of the content visible to the user.
|
|
84
|
+
*/
|
|
85
|
+
setPositionTrackerHeight(trackerHeight: number): void;
|
|
86
|
+
/**
|
|
87
|
+
* @param data DOM event data
|
|
88
|
+
*/
|
|
89
|
+
private _handleMinimapClick;
|
|
90
|
+
/**
|
|
91
|
+
* @param data DOM event data
|
|
92
|
+
*/
|
|
93
|
+
private _handleMinimapMouseWheel;
|
|
94
94
|
}
|
|
95
95
|
/**
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
96
|
+
* Fired when the minimap view is clicked.
|
|
97
|
+
*
|
|
98
|
+
* @eventName ~MinimapView#click
|
|
99
|
+
* @param percentage The number between 0 and 1 representing a place in the minimap (its height) that was clicked.
|
|
100
|
+
*/
|
|
101
101
|
export type MinimapClickEvent = {
|
|
102
|
-
|
|
103
|
-
|
|
102
|
+
name: "click";
|
|
103
|
+
args: [percentage: number];
|
|
104
104
|
};
|
|
105
105
|
/**
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
106
|
+
* Fired when the position tracker is dragged or the minimap is scrolled via mouse wheel.
|
|
107
|
+
*
|
|
108
|
+
* @eventName ~MinimapView#drag
|
|
109
|
+
* @param movementY The vertical movement of the minimap as a result of dragging or scrolling.
|
|
110
|
+
*/
|
|
111
111
|
export type MinimapDragEvent = {
|
|
112
|
-
|
|
113
|
-
|
|
112
|
+
name: "drag";
|
|
113
|
+
args: [movementY: number];
|
|
114
114
|
};
|