@ckeditor/ckeditor5-editor-inline 41.3.0-alpha.4 → 41.3.1

Sign up to get free protection for your applications and to get access to all the features.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ckeditor/ckeditor5-editor-inline",
3
- "version": "41.3.0-alpha.4",
3
+ "version": "41.3.1",
4
4
  "description": "Inline editor implementation for CKEditor 5.",
5
5
  "keywords": [
6
6
  "ckeditor",
@@ -12,7 +12,7 @@
12
12
  "type": "module",
13
13
  "main": "src/index.js",
14
14
  "dependencies": {
15
- "ckeditor5": "41.3.0-alpha.4",
15
+ "ckeditor5": "41.3.1",
16
16
  "lodash-es": "4.17.21"
17
17
  },
18
18
  "author": "CKSource (http://cksource.com/)",
@@ -25,7 +25,6 @@
25
25
  "directory": "packages/ckeditor5-editor-inline"
26
26
  },
27
27
  "files": [
28
- "dist",
29
28
  "lang",
30
29
  "src/**/*.js",
31
30
  "src/**/*.d.ts",
@@ -1,4 +0,0 @@
1
- /**
2
- * @license Copyright (c) 2003-2024, CKSource Holding sp. z o.o. All rights reserved.
3
- * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
4
- */
@@ -1,4 +0,0 @@
1
- /**
2
- * @license Copyright (c) 2003-2024, CKSource Holding sp. z o.o. All rights reserved.
3
- * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
4
- */
package/dist/index.css DELETED
@@ -1,4 +0,0 @@
1
- /**
2
- * @license Copyright (c) 2003-2024, CKSource Holding sp. z o.o. All rights reserved.
3
- * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
4
- */
@@ -1,12 +0,0 @@
1
- /**
2
- * @license Copyright (c) 2003-2024, 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
- * @license Copyright (c) 2003-2024, CKSource Holding sp. z o.o. All rights reserved.
7
- * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
8
- */
9
- /**
10
- * @module editor-inline
11
- */
12
- export { default as InlineEditor } from './inlineeditor.js';
@@ -1,180 +0,0 @@
1
- /**
2
- * @license Copyright (c) 2003-2024, 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
- * @license Copyright (c) 2003-2024, CKSource Holding sp. z o.o. All rights reserved.
7
- * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
8
- */
9
- /**
10
- * @module editor-inline/inlineeditor
11
- */
12
- import { Editor, Context, type EditorConfig } from 'ckeditor5/src/core.js';
13
- import { ContextWatchdog, EditorWatchdog } from 'ckeditor5/src/watchdog.js';
14
- import InlineEditorUI from './inlineeditorui.js';
15
- declare const InlineEditor_base: import("ckeditor5/src/utils.js").Mixed<typeof Editor, import("ckeditor5/src/core.js").ElementApi>;
16
- /**
17
- * The {@glink installation/getting-started/predefined-builds#inline-editor inline editor} implementation.
18
- * It uses an inline editable and a floating toolbar.
19
- * See the {@glink examples/builds/inline-editor demo}.
20
- *
21
- * In order to create a inline editor instance, use the static
22
- * {@link module:editor-inline/inlineeditor~InlineEditor.create `InlineEditor.create()`} method.
23
- *
24
- * # Inline editor and inline build
25
- *
26
- * The inline editor can be used directly from source (if you installed the
27
- * [`@ckeditor/ckeditor5-editor-inline`](https://www.npmjs.com/package/@ckeditor/ckeditor5-editor-inline) package)
28
- * but it is also available in the {@glink installation/getting-started/predefined-builds#inline-editor inline build}.
29
- *
30
- * {@glink installation/getting-started/predefined-builds Builds}
31
- * are ready-to-use editors with plugins bundled in. When using the editor from
32
- * source you need to take care of loading all plugins by yourself
33
- * (through the {@link module:core/editor/editorconfig~EditorConfig#plugins `config.plugins`} option).
34
- * Using the editor from source gives much better flexibility and allows easier customization.
35
- *
36
- * Read more about initializing the editor from source or as a build in
37
- * {@link module:editor-inline/inlineeditor~InlineEditor.create `InlineEditor.create()`}.
38
- */
39
- export default class InlineEditor extends InlineEditor_base {
40
- /**
41
- * @inheritDoc
42
- */
43
- readonly ui: InlineEditorUI;
44
- /**
45
- * Creates an instance of the inline editor.
46
- *
47
- * **Note:** Do not use the constructor to create editor instances. Use the static
48
- * {@link module:editor-inline/inlineeditor~InlineEditor.create `InlineEditor.create()`} method instead.
49
- *
50
- * @param sourceElementOrData The DOM element that will be the source for the created editor
51
- * (on which the editor will be initialized) or initial data for the editor. For more information see
52
- * {@link module:editor-inline/inlineeditor~InlineEditor.create `InlineEditor.create()`}.
53
- * @param config The editor configuration.
54
- */
55
- protected constructor(sourceElementOrData: HTMLElement | string, config?: EditorConfig);
56
- /**
57
- * Destroys the editor instance, releasing all resources used by it.
58
- *
59
- * Updates the original editor element with the data if the
60
- * {@link module:core/editor/editorconfig~EditorConfig#updateSourceElementOnDestroy `updateSourceElementOnDestroy`}
61
- * configuration option is set to `true`.
62
- */
63
- destroy(): Promise<unknown>;
64
- /**
65
- * Creates a new inline editor instance.
66
- *
67
- * There are three general ways how the editor can be initialized.
68
- *
69
- * # Using an existing DOM element (and loading data from it)
70
- *
71
- * You can initialize the editor using an existing DOM element:
72
- *
73
- * ```ts
74
- * InlineEditor
75
- * .create( document.querySelector( '#editor' ) )
76
- * .then( editor => {
77
- * console.log( 'Editor was initialized', editor );
78
- * } )
79
- * .catch( err => {
80
- * console.error( err.stack );
81
- * } );
82
- * ```
83
- *
84
- * The element's content will be used as the editor data and the element will become the editable element.
85
- *
86
- * # Creating a detached editor
87
- *
88
- * Alternatively, you can initialize the editor by passing the initial data directly as a `String`.
89
- * In this case, the editor will render an element that must be inserted into the DOM for the editor to work properly:
90
- *
91
- * ```ts
92
- * InlineEditor
93
- * .create( '<p>Hello world!</p>' )
94
- * .then( editor => {
95
- * console.log( 'Editor was initialized', editor );
96
- *
97
- * // Initial data was provided so the editor UI element needs to be added manually to the DOM.
98
- * document.body.appendChild( editor.ui.element );
99
- * } )
100
- * .catch( err => {
101
- * console.error( err.stack );
102
- * } );
103
- * ```
104
- *
105
- * This lets you dynamically append the editor to your web page whenever it is convenient for you. You may use this method if your
106
- * web page content is generated on the client side and the DOM structure is not ready at the moment when you initialize the editor.
107
- *
108
- * # Using an existing DOM element (and data provided in `config.initialData`)
109
- *
110
- * You can also mix these two ways by providing a DOM element to be used and passing the initial data through the configuration:
111
- *
112
- * ```ts
113
- * InlineEditor
114
- * .create( document.querySelector( '#editor' ), {
115
- * initialData: '<h2>Initial data</h2><p>Foo bar.</p>'
116
- * } )
117
- * .then( editor => {
118
- * console.log( 'Editor was initialized', editor );
119
- * } )
120
- * .catch( err => {
121
- * console.error( err.stack );
122
- * } );
123
- * ```
124
- *
125
- * This method can be used to initialize the editor on an existing element with the specified content in case if your integration
126
- * makes it difficult to set the content of the source element.
127
- *
128
- * Note that an error will be thrown if you pass the initial data both as the first parameter and also in the configuration.
129
- *
130
- * # Configuring the editor
131
- *
132
- * See the {@link module:core/editor/editorconfig~EditorConfig editor configuration documentation} to learn more about
133
- * customizing plugins, toolbar and more.
134
- *
135
- * # Using the editor from source
136
- *
137
- * The code samples listed in the previous sections of this documentation assume that you are using an
138
- * {@glink installation/getting-started/predefined-builds editor build} (for example – `@ckeditor/ckeditor5-build-inline`).
139
- *
140
- * If you want to use the inline editor from source (`@ckeditor/ckeditor5-editor-inline/src/inlineeditor`),
141
- * you need to define the list of
142
- * {@link module:core/editor/editorconfig~EditorConfig#plugins plugins to be initialized} and
143
- * {@link module:core/editor/editorconfig~EditorConfig#toolbar toolbar items}. Read more about using the editor from
144
- * source in the {@glink installation/advanced/alternative-setups/integrating-from-source-webpack dedicated guide}.
145
- *
146
- * @param sourceElementOrData The DOM element that will be the source for the created editor
147
- * or the editor's initial data.
148
- *
149
- * If a DOM element is passed, its content will be automatically loaded to the editor upon initialization.
150
- * The editor data will be set back to the original element once the editor is destroyed only if the
151
- * {@link module:core/editor/editorconfig~EditorConfig#updateSourceElementOnDestroy updateSourceElementOnDestroy}
152
- * option is set to `true`.
153
- *
154
- * If the initial data is passed, a detached editor will be created. In this case you need to insert it into the DOM manually.
155
- * It is available under the {@link module:editor-inline/inlineeditorui~InlineEditorUI#element `editor.ui.element`} property.
156
- *
157
- * @param config The editor configuration.
158
- * @returns A promise resolved once the editor is ready. The promise resolves with the created editor instance.
159
- */
160
- static create(sourceElementOrData: HTMLElement | string, config?: EditorConfig): Promise<InlineEditor>;
161
- /**
162
- * The {@link module:core/context~Context} class.
163
- *
164
- * Exposed as static editor field for easier access in editor builds.
165
- */
166
- static Context: typeof Context;
167
- /**
168
- * The {@link module:watchdog/editorwatchdog~EditorWatchdog} class.
169
- *
170
- * Exposed as static editor field for easier access in editor builds.
171
- */
172
- static EditorWatchdog: typeof EditorWatchdog;
173
- /**
174
- * The {@link module:watchdog/contextwatchdog~ContextWatchdog} class.
175
- *
176
- * Exposed as static editor field for easier access in editor builds.
177
- */
178
- static ContextWatchdog: typeof ContextWatchdog;
179
- }
180
- export {};
@@ -1,56 +0,0 @@
1
- /**
2
- * @license Copyright (c) 2003-2024, 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
- * @license Copyright (c) 2003-2024, CKSource Holding sp. z o.o. All rights reserved.
7
- * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
8
- */
9
- /**
10
- * @module editor-inline/inlineeditorui
11
- */
12
- import { type Editor } from 'ckeditor5/src/core.js';
13
- import { EditorUI } from 'ckeditor5/src/ui.js';
14
- import type InlineEditorUIView from './inlineeditoruiview.js';
15
- /**
16
- * The inline editor UI class.
17
- *
18
- * @extends module:ui/editorui/editorui~EditorUI
19
- */
20
- export default class InlineEditorUI extends EditorUI {
21
- /**
22
- * The main (top–most) view of the editor UI.
23
- */
24
- readonly view: InlineEditorUIView;
25
- /**
26
- * A normalized `config.toolbar` object.
27
- */
28
- private readonly _toolbarConfig;
29
- /**
30
- * Creates an instance of the inline editor UI class.
31
- *
32
- * @param editor The editor instance.
33
- * @param view The view of the UI.
34
- */
35
- constructor(editor: Editor, view: InlineEditorUIView);
36
- /**
37
- * @inheritDoc
38
- */
39
- get element(): HTMLElement | null;
40
- /**
41
- * Initializes the UI.
42
- */
43
- init(): void;
44
- /**
45
- * @inheritDoc
46
- */
47
- destroy(): void;
48
- /**
49
- * Initializes the inline editor toolbar and its panel.
50
- */
51
- private _initToolbar;
52
- /**
53
- * Enable the placeholder text on the editing root.
54
- */
55
- private _initPlaceholder;
56
- }
@@ -1,141 +0,0 @@
1
- /**
2
- * @license Copyright (c) 2003-2024, 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
- * @license Copyright (c) 2003-2024, CKSource Holding sp. z o.o. All rights reserved.
7
- * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
8
- */
9
- /**
10
- * @module editor-inline/inlineeditoruiview
11
- */
12
- import { BalloonPanelView, EditorUIView, InlineEditableUIView, ToolbarView } from 'ckeditor5/src/ui.js';
13
- import { type PositioningFunction, type Locale } from 'ckeditor5/src/utils.js';
14
- import type { EditingView } from 'ckeditor5/src/engine.js';
15
- /**
16
- * Inline editor UI view. Uses an nline editable and a floating toolbar.
17
- */
18
- export default class InlineEditorUIView extends EditorUIView {
19
- /**
20
- * A floating toolbar view instance.
21
- */
22
- readonly toolbar: ToolbarView;
23
- /**
24
- * The offset from the top edge of the web browser's viewport which makes the
25
- * UI become sticky. The default value is `0`, which means that the UI becomes
26
- * sticky when its upper edge touches the top of the page viewport.
27
- *
28
- * This attribute is useful when the web page has UI elements positioned to the top
29
- * either using `position: fixed` or `position: sticky`, which would cover the
30
- * UI or vice–versa (depending on the `z-index` hierarchy).
31
- *
32
- * Bound to {@link module:ui/editorui/editorui~EditorUI#viewportOffset `EditorUI#viewportOffset`}.
33
- *
34
- * If {@link module:core/editor/editorconfig~EditorConfig#ui `EditorConfig#ui.viewportOffset.top`} is defined, then
35
- * it will override the default value.
36
- *
37
- * @observable
38
- * @default 0
39
- */
40
- viewportTopOffset: number;
41
- /**
42
- * A balloon panel view instance.
43
- */
44
- readonly panel: BalloonPanelView;
45
- /**
46
- * A set of positioning functions used by the {@link #panel} to float around
47
- * {@link #element editableElement}.
48
- *
49
- * The positioning functions are as follows:
50
- *
51
- * * West:
52
- *
53
- * ```
54
- * [ Panel ]
55
- * +------------------+
56
- * | #editableElement |
57
- * +------------------+
58
- *
59
- * +------------------+
60
- * | #editableElement |
61
- * |[ Panel ] |
62
- * | |
63
- * +------------------+
64
- *
65
- * +------------------+
66
- * | #editableElement |
67
- * +------------------+
68
- * [ Panel ]
69
- * ```
70
- *
71
- * * East:
72
- *
73
- * ```
74
- * [ Panel ]
75
- * +------------------+
76
- * | #editableElement |
77
- * +------------------+
78
- *
79
- * +------------------+
80
- * | #editableElement |
81
- * | [ Panel ]|
82
- * | |
83
- * +------------------+
84
- *
85
- * +------------------+
86
- * | #editableElement |
87
- * +------------------+
88
- * [ Panel ]
89
- * ```
90
- *
91
- * See: {@link module:utils/dom/position~Options#positions}.
92
- */
93
- readonly panelPositions: Array<PositioningFunction>;
94
- /**
95
- * Editable UI view.
96
- */
97
- readonly editable: InlineEditableUIView;
98
- /**
99
- * An instance of the resize observer that helps dynamically determine the geometry of the toolbar
100
- * and manage items that do not fit into a single row.
101
- *
102
- * **Note:** Created in {@link #render}.
103
- */
104
- private _resizeObserver;
105
- /**
106
- * Creates an instance of the inline editor UI view.
107
- *
108
- * @param locale The {@link module:core/editor/editor~Editor#locale} instance.
109
- * @param editingView The editing view instance this view is related to.
110
- * @param editableElement The editable element. If not specified, it will be automatically created by
111
- * {@link module:ui/editableui/editableuiview~EditableUIView}. Otherwise, the given element will be used.
112
- * @param options Configuration options for the view instance.
113
- * @param options.shouldToolbarGroupWhenFull When set `true` enables automatic items grouping
114
- * in the main {@link module:editor-inline/inlineeditoruiview~InlineEditorUIView#toolbar toolbar}.
115
- * See {@link module:ui/toolbar/toolbarview~ToolbarOptions#shouldGroupWhenFull} to learn more.
116
- */
117
- constructor(locale: Locale, editingView: EditingView, editableElement?: HTMLElement, options?: {
118
- shouldToolbarGroupWhenFull?: boolean;
119
- });
120
- /**
121
- * @inheritDoc
122
- */
123
- render(): void;
124
- /**
125
- * @inheritDoc
126
- */
127
- destroy(): void;
128
- /**
129
- * Determines the panel top position of the {@link #panel} in {@link #panelPositions}.
130
- *
131
- * @param editableRect Rect of the {@link #element}.
132
- * @param panelRect Rect of the {@link #panel}.
133
- */
134
- private _getPanelPositionTop;
135
- /**
136
- * Returns the positions for {@link #panelPositions}.
137
- *
138
- * See: {@link module:utils/dom/position~Options#positions}.
139
- */
140
- private _getPanelPositions;
141
- }